在fullcalendar中添加事件hovertext

我想在完整日曆的月份日曆頁面中的事件中包含懸停文本。在fullcalendar中添加事件hovertext

我有和數組對象聲明需要在頁面上由php腳本加載的事件。它看起來如下：

$('#calendar').fullCalendar({ 
events: [ 
    { 
     title : 'event1', 
     start : '2010-01-01' 
    }, 
    { 
     title : 'event2', 
     start : '2010-01-05', 
     end : '2010-01-07' 
    } 
]

}）;

我想使用eventMouseover函數爲每個事件包含一個懸停文本。該函數的原型如下所示：function（event，jsEvent，view）{}其中event是事件對象，jsEvent是具有低級信息（如鼠標座標）的本機JavaScript事件。該視圖保存fullcalendar的視圖對象。我無法正確調用該函數的參數。我的信息來自於這裏：http://arshaw.com/fullcalendar/docs/mouse/eventMouseover/，我完全喜歡用其他方式在每個事件上獲得一個hovertext。謝謝。

來源

2012-03-28 usumoio

你在正確的軌道上。我做了類似的事情，在議程視圖中顯示事件底部的事件結束時間。

日曆選項：

eventMouseover: function(event, jsEvent, view) { 
    $('.fc-event-inner', this).append('<div id=\"'+event.id+'\" class=\"hover-end\">'+$.fullCalendar.formatDate(event.end, 'h:mmt')+'</div>'); 
} 

eventMouseout: function(event, jsEvent, view) { 
    $('#'+event.id).remove(); 
}

CSS的懸停：

.hover-end{padding:0;margin:0;font-size:75%;text-align:center;position:absolute;bottom:0;width:100%;opacity:.8}

希望這可以幫助你！

來源

2012-09-17 20:21:26

感謝@邁克爾lrigoyen，它非常有助於全給我... – 2013-12-04 13:46:10

我已經通過了兩個事件源。是否有可能只顯示懸停只有一個事件源？ – 2013-12-07 07:56:13

如果使用的是引導，這是非常優雅的解決方案：

eventRender: function(event, element) { 
    $(element).tooltip({title: event.title}); 
}

（我是從這樣的回答：https://stackoverflow.com/a/27922934/2941313）

來源

2017-07-17 09:18:52

爲我工作 - 謝謝！ :) – 2017-07-28 19:11:19

在fullcalendar中添加事件hovertext

回答

相關問題