fullcalendar stała wysokość rzędu

Question

Jak ustawić stałą wysokość wiersza w fullcalendar? Chcę mieć pionowy pasek przewijania, jeśli jest zbyt wiele zdarzeń.

$('#calendar').fullCalendar('option', 'contentHeight', 50); 

Answer 1

Jeśli chcesz zmienić wysokość wierszy z każdym przedziałem czasu, możesz zastąpić klasę css.

.fc-agenda-slots td div { 
    height: 40px !important; 
} 

Jeśli masz na myśli coś jeszcze, daj nam znać.

Treść zawartości służy do obliczania tylko wysokości kalendarza.

Answer 2

W moim skrypcie chciałem zmniejszyć rzędy, ale można użyć tego samego kodu, aby je powiększyć. Przy zmniejszaniu rzędów musiałem scalić każdą z 4 komórek (podczas pracy w 15-minutowej granulacji) pierwszej kolumny, aby wskazanie godziny pasowało do komórki. Użyj poniższego kodu, aby scalić komórki:

$(function(){ 
    // Merge first column, each 4 rows to display time in larger format 
    $('table.fc-agenda-slots tbody tr:not(.fc-minor)').each(function(){ 
     $(this).find("th:first-child").css("font-size", "12px").attr('rowSpan',4); // 
     $(this).nextUntil("tr:not(.fc-minor)","tr.fc-minor").find("th:first-child").remove(); 
    }); 
}) 

Następnie użyj CSS, aby zastosować wysokość prawego rzędu. Zwróć uwagę, że dodałem styl linii wysokości, który potrzebowałem do kompatybilności z bootstrapem. Upewniłem się również, że podczas przeciągania poza kalendarz, domyślne zachowanie wyboru nie ma zastosowania.

 body { 
      -moz-user-select: none; 
      -khtml-user-select: none; 
      -webkit-user-select: none; 
      user-select: none;    
     } 

     .fc-agenda-slots td div { 
      height: 6px; 
      line-height: 6px; 
     } 
     .fc-agenda-axis { 
      font-size:1px; 
      line-height: 1px; 
     } 

Answer 3

dla mnie tylko to działało

.fc-agendaWeek-view tr { 
    height: 40px; 
} 

.fc-agendaDay-view tr { 
    height: 40px; 
}