年视图中fullcalendar的工具提示

我想在年视图中为fullcalendar添加工具提示。 我尝试使用下面的一个，但它在月视图中添加了工具提示。 我尝试使用谷歌，但没有找到任何与此相关的内容。 还有其他方法可以在年视图中添加工具提示吗？

eventMouseover: function(calEvent,jsEvent) { xOffset = 10; yOffset = 30; $("body").append(calEvent.tooltip); $("#tooltip") .css("top",(jsEvent.clientY - xOffset) + "px") .css("left",(jsEvent.clientX + yOffset) + "px") .fadeIn("fast"); }, eventMouseout: function(calEvent,jsEvent) { $("#tooltip").remove(); } 

Answer 1

 eventMouseover: function(calEvent, jsEvent) { var tooltip = '
' + calEvent.title + '
'; var $tooltip = $(tooltip).appendTo('body'); $(this).mouseover(function(e) { $(this).css('z-index', 10000); $tooltip.fadeIn('500'); $tooltip.fadeTo('10', 1.9); }).mousemove(function(e) { $tooltip.css('top', e.pageY + 10); $tooltip.css('left', e.pageX + 20); }); }, eventMouseout: function(calEvent, jsEvent) { $(this).css('z-index', 8); $('.tooltipevent').remove(); }, 

Answer 2

您可以在没有任何工具提示库的情况下使用html title属性：

 $('#calendar').fullCalendar({ events: [ { title: 'My Event', start: '2014-01-01', tooltip: 'This is a cool event' } // more events here ], eventRender: function(event, element) { element.attr('title', event.tooltip); } }); 

Answer 3

从1.5版开始，您可以使用qtip（我也使用tipsy但它应该与工具提示一起使用）来显示事件的提示：

 $('#calendar').fullCalendar({ events: [ { title: 'My Event', start: '2010-01-01', description: 'This is a cool event' } // more events here ], eventRender: function(event, element) { element.qtip({ content: event.description }); } }); 

doc来源： http ： //arshaw.com/fullcalendar/docs/event_rendering/eventRender/

希望这可以帮助

Answer 4

这里另一个实现

 eventMouseover: function(calEvent, jsEvent) { var tooltip = '
 Title: ' + calEvent.title + '
'; var $tool = $(tooltip).appendTo('body'); $(this).mouseover(function(e) { $(this).css('z-index', 10000); $tool.fadeIn('500'); $tool.fadeTo('10', 1.9); }).mousemove(function(e) { $tool.css('top', e.pageY + 10); $tool.css('left', e.pageX + 20); }); }, eventMouseout: function(calEvent, jsEvent) { $(this).css('z-index', 8); $('.tooltipevent').remove(); }, 

---