问题描述
希望使用完整日历",并将图像包括为事件和可拖动对象.简而言之,很想看看这个示例如何 https://fullcalendar .io/js/fullcalendar-3.0.1/demos/external-dragging.html 可以使用较小的缩略图,而不是文本"My Event 1,My Event 2"等.日历.
Looking to use Full Calendar and to include images as events and draggable. In short, would love to see how this example https://fullcalendar.io/js/fullcalendar-3.0.1/demos/external-dragging.html would work with small thumbnails instead of the text "My Event 1, My Event 2" etc. And have that image show up on the calendar.
谢谢.
推荐答案
您可以通过在事件定义中添加属性"imageurl"来向eventObject添加任何图像url(如果只需要图像,则不要指定标题):
You can add any image url to your eventObject by adding the attribute "imageurl" inside of the events definition (if you just want the image, don't specify a title):
events: [
{
title : 'event',
start : '2016-10-12',
end : '2016-10-14',
imageurl:'img/edit.png', //you can pass the image url with a variable if you wish different images for each event
.
.
.
}
然后,在eventRender中添加以下代码,该代码会将图像图标添加到事件中(16宽度和高度是缩略图的合适大小):
After that, you add the following code in the eventRender, which will add the image icon to the event (16 width and height is a good size for a thumbnail):
eventRender: function(event, eventElement) {
if (event.imageurl) {
eventElement.find("div.fc-content").prepend("<img src='" + event.imageurl +"' width='16' height='16'>");
}
},
有关更多详细信息,请参阅以下问题:添加图标( s)在事件的第一行(fullCalendar)
For further details refer to this question: Add Icon(s) in first line of an event (fullCalendar)
这篇关于FullCalendar-图片作为事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!