如何使jQuery FullCalendar的高度適合其內容？

Question

我想在議程視圖（周和日）中刪除日歷的 div中的滾動條，並且如果日歷的內容不適合瀏覽器視口，則僅使用瀏覽器的滾動條。

所以我認為我需要調整日歷的高度以使其內容合適。 我怎樣才能做到這一點？

Answer 1

有一個getView方法返回當前活動的View。 而且這個View有自己的方法setHeight ，所以你可以創建一個這樣的函數：

function resizeCalendar(calendarView) {
    if(calendarView.name === 'agendaWeek' || calendarView.name === 'agendaDay') {
        // if height is too big for these views, then scrollbars will be hidden
        calendarView.setHeight(9999);
    }
}

並在視圖更改時調用它：

$('#calendar').fullCalendar({
    viewDisplay: resizeCalendar,
    ...
});

工作JSFiddle

Answer 2

在2.1.0版中，您可以使用height或contentHeight選項並將其值設置為auto 。

height選項指整個日歷的高度（包括標題）。 contentHeight選項引用日歷的內容區域高度。

根據插件的文檔 ， auto的值意味着視圖的內容將采用自然高度，並且不會使用滾動條。

按如下方式初始化日歷：

$('#calendar').fullCalendar({
    contentHeight: "auto",
    // .... other options here 
});

在這里小提琴： https ： //jsfiddle.net/yj90oqzf/

更多信息：

• https://fullcalendar.io/docs/display/height/
• https://fullcalendar.io/docs/display/contentHeight/