[英]How do you apply twitter modal popup on fullcalendar event click
我現在正在使用fullCalendar jQuery插件,並且計划在eventClick上應用Twitter Modal Bootstrap。 如何將這種方法應用於日歷插件? 提前致謝!
您可以通過執行以下操作來實現:
eventClick: function(event) {
var modal = $("#modal");
modal.find(".modal-title").html(event.title);
modal.modal();
}
有關完整的代碼和功能,請參見以下jsfiddle
我剛剛看到了這個問題,我認為這可能會對某人有所幫助。 這段代碼對我有用:
$(document).ready(function() {
var $calPopOver;
$('#calendar').fullCalendar({
defaultDate: '2015-07-23',
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
eventMouseover: function (date, allDay, jsEvent, view) {
$(this).children().popover({
title: '<p>Lorem ipsum dolor sit amet</p>',
placement: 'right',
content: 'Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.',
html: true,
container: 'body'
});
if($calPopOver)
$calPopOver.popover('destroy');
$calPopOver = $(this).children().popover('show');
},
eventLimit: false, // allow "more" link when too many events
events: [
{
title: 'All Day Event',
start: '2015-07-04'
},
{
title: 'Long Event',
start: '2015-07-18',
end: '2014-07-19'
},
{
title: 'Click for Google',
url: 'http://google.com/',
start: '2015-07-23'
}
]
}); });
要獲得懸停效果,您可以從“ eventClick”更改為“ eventMouseover”
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.