Fullcalendar with Twitter Bootstrap Popover

我正試圖讓Fullcalendar與twitter boostrap popovers一起工作。
如果我點擊一個事件，我想在彈窗中顯示一些細節。
所以首先加入這個可愛的小片段來Fullcalendar：Fullcalendar with Twitter Bootstrap Popover

eventClick: function(event, jsEvent, view) { 
     $this = $(this); 
     $this.popover({html:true,title:event.title,placement:'top'}).popover('show'); 
     return false;    
    },

但現在我遇到兩個問題：

Fullcalendar是具有溢出DIV中：隱藏什麼，因爲酥料餅被削減在Fullcalendar的邊界上。我如何解決這個問題？
與問題2類似，我希望通過頂部，左側，右側或底部的函數放置彈出窗口，具體取決於事件在Fullcalendar網格中的位置。我如何做這樣的功能？

謝謝！

來源

2013-01-04 Merion

將是巨大的，如果你可以提供撥弄或鏈接的網頁。 – BillPull

對於第2點）我現在實現了一個次優解決方案，也就是說，如果事件從星期日到星期三發生，我將彈出窗口放在右邊，否則放到左邊。如果view.type是Day或agendaDay，我把它放在最上面。這樣你通常可以防止任何東西被遮擋的彈出窗口。 – Petruza

從版本2.3自舉現在有popovers的「容器」選項，它追加到酥料餅的特定元素。

只需添加{container:'body'}將其追加到身體

$this.popover({html:true,title:event.title,placement:'top',container:'body'}).popover('show');

來源

2013-04-03 13:05:22 clemnt

這很有效，除非您滾動日曆，現在彈出窗口仍然保留在相對於主體的相同位置，但現在它已從日曆事件中分離出來。 – Petruza

此代碼幫助我

$('#calendar').fullCalendar({ 
    eventRender: function (event, element) { 
     element.popover({ 
      title: event.name, 
      placement: 'right', 
      content: + '<br />Start: ' + event.starts_at + '<br />End: ' + event.ends_at + '<br />Description: ' + event.description, 
     }); 
    } 
});

引導版本 - 2.3.2，完整的日曆 - 1.6.4

取自https://groups.google.com/forum/#!topic/twitter-bootstrap-stackoverflow/9pkC3_lodmY

來源

2013-09-24 04:52:25 dav

將彈出窗口追加到日曆容器用日曆滾動彈出窗口。

  $(jsEvent.target).popover({ 
       html: true, 
       container:'#calendar', 
       placement: 'right' 
      });

來源

2015-08-18 09:31:52

Fullcalendar with Twitter Bootstrap Popover

回答

相關問題