JQuery fullcalendar：無法爲agendaWeek或agendaDay模式設置高度

我嘗試爲fullCalendar中的agendaWeek視圖設置高度。最終目標是將日曆安裝到用戶的窗口，並使fullcalendar使用無滾動條的最大可用位置。JQuery fullcalendar：無法爲agendaWeek或agendaDay模式設置高度

事實是，文檔顯示有關height或contentHeight選項，但這對於在agendaWeek或agendaDay視圖中計算的高度沒有影響。

下面是一個例子jsfiddle

var date = new Date(); 
var d = date.getDate(); 
var m = date.getMonth(); 
var y = date.getFullYear(); 

$('#calendar').fullCalendar({ 
    defaultView: "agendaWeek", 
    height: 2500, 
    header: { 
     left: 'prev,next today', 
     center: 'title', 
     right: 'month,agendaWeek,agendaDay' 
    }, 
    editable: true, 
    events: [ 
     { 
      title: 'All Day Event', 
      start: new Date(y, m, 1) 
     }, 
     { 
      title: 'Long Event', 
      start: new Date(y, m, d-5), 
      end: new Date(y, m, d-2) 
     }, 
     { 
      id: 999, 
      title: 'Repeating Event', 
      start: new Date(y, m, d-3, 16, 0), 
      allDay: false 
     }, 
     { 
      id: 999, 
      title: 'Repeating Event', 
      start: new Date(y, m, d+4, 16, 0), 
      allDay: false 
     }, 
     { 
      title: 'Meeting', 
      start: new Date(y, m, d, 10, 30), 
      allDay: false 
     }, 
     { 
      title: 'Lunch', 
      start: new Date(y, m, d, 12, 0), 
      end: new Date(y, m, d, 14, 0), 
      allDay: false 
     }, 
     { 
      title: 'Birthday Party', 
      start: new Date(y, m, d+1, 19, 0), 
      end: new Date(y, m, d+1, 22, 30), 
      allDay: false 
     }, 
     { 
      title: 'Click for Google', 
      start: new Date(y, m, 28), 
      end: new Date(y, m, 29), 
      url: 'http://google.com/' 
     } 
    ] 
});

我試圖瞭解jquery.fullcalendar高度設置在這些模式下，但無法找到一個解決方案。我還試圖強行通過CSS高度動態調節像

var view = $("#calendar").fullCalendar("getView"); 
if(view.name == 'agendaWeek' || view.name == 'agendaDay') 
    $("table.fc-agenda-slots td > div").height(Math.floor((toHeight-50)/24)-1);

但它會導致錯誤切換視圖時（出現在某些交換機滾動條）

你有一個想法？

來源

2013-08-20 ZalemCitizen

您是否檢查寬高比？ http://arshaw.com/fullcalendar/docs/display/aspectRatio/ –

好的，我發現一種解決方法由於其他問題報告如this one

我在默認agendaWeek視圖加載fullCalendar，然後調整在viewRender選項寬度與鹼性

$("#calendar").width(myWidth);

中的列寬是錯誤的，我需要執行這個曾經

$("#calendar").fullCalendar("render");

然後我調整高度與「髒」

$("table.fc-agenda-slots td > div").height(Math.floor((toHeight-50)/24)-1);

其中toHeight爲日曆可用高度，50日曆報頭的約，行24數我在我的日程視圖和1一調整

此時顯示，滾動條在議程示出了意見，讓我申請通過Sinetheta（以上CF鏈路）的伎倆，我選擇運用它像：

view.setHeight(9999);

的技巧會導致月視圖的問題，所以整個招看起來像這樣

var view = $("#calendar").fullCalendar("getView"); 
if(view.name == 'agendaWeek' || view.name == 'agendaDay') 
{ 
    $("table.fc-agenda-slots td > div").height(Math.floor((toHeight-50)/24)-1); // 50: approx header height, 24: number of rows in agenda view (I only display from 7am to 19pm) 
    view.setHeight(9999); // Get rid of scrollbar 
} 
if(view.name == 'month') 
{ 
    $("tr.fc-week td > div").css("min-height", ""); 
    $("tr.fc-week td > div").height(Math.floor((toHeight-50)/6)-1); // 50: approx header height, 6: number of rows in month view 
}

我找到的伎倆有點難看，我想它可以通過獲取真正的頭高度和行數來改善，但無論如何，它的工作原理

注：這一招是包含在calendarResize功能我執行的fullCalendar內的viewRender功能

來源

2013-08-20 16:51:58 ZalemCitizen

JQuery fullcalendar：無法爲agendaWeek或agendaDay模式設置高度

回答

相關問題