2014-10-12 17 views
11

Potrzebuję mieć kalendarz w trybie tygodniowym, który zajmowałby całą szerokość, jaką może zabrać i zabrał całą wysokość, jakiej potrzebuje, aby nie mieć pasków przewijania.Automatyczna wysokość FullCalendar w widoku tygodniowym

Gdybym zachować ustawienia domyślne height: auto, aspectRation: 1.35 widzę pionowy pasek przewijania: enter image description here

Jeśli zmienię aspectRatio 1, pasek przewijania znika ale widzę bezużyteczną pusty obszar na dole:

enter image description here

Czy istnieje sposób, aby to naprawić, z wyjątkiem zgadywania aspektRatio (co nie jest dla mnie przypadku, jak minTime i maxTime są dynamicznie zmieniane, aby zmiany wysokości conent)?

+0

można spróbować zmienić css może być? http://stackoverflow.com/questions/10398069/resizing-a-div-to-fit-content-w-maximum-helifts –

+0

Jaką wersję kalendarza pełnego używasz? – MarCrazyness

+0

@MarCrazyness, FullCalendar v2.1.1 – SiberianGuy

Odpowiedz

21

Edit:

Fullcalendar V2.1.1

http://jsfiddle.net/3E8nk/560/

contentHeight: 'auto', 

rozwiązanie dla starszych wersji?

Rodzaj hack: ish. Czy to działa w twoim środowisku? Użyłem kodu z twojego drugiego pytania.

http://jsfiddle.net/3E8nk/558/

contentHeight: '9999', 
+0

Próbowałem tego. Niestety nie działa w wersji 2.1.1. Tutaj możesz jsfiddle ze zaktualizowanymi zasobami zewnętrznymi: http://jsfiddle.net/3E8nk/559/ – SiberianGuy

+0

@Idsa dzięki, nie zdawałem sobie sprawy. Znalazłem rozwiązanie, które było mniej hack: ish też dla nowej wersji fullcalendar :) –

+0

Wielkie dzięki! To mylące, że nie jest to opcja domyślna. Powinienem był zwrócić większą uwagę na dokumentację ... – SiberianGuy

8

Regulacja dynamicznie wysokośćzamiast wskaźnika kształtu pracował dla mnie:

Asigning kalendarza do zmiennej przy rozpoczynaniu:

calendar = $('#calendar').fullCalendar({ 
    height: $(window).height()*0.83, 
    ... 
}); 

I następnie dynamicznie regulować wysokość (po sprawdzeniu) kalendarz już istnieje w celu uniknięcia początkowe komunikaty o błędach):

if(calendar) { 
    $(window).resize(function() { 
    var calHeight = $(window).height()*0.83; 
    $('#calendar').fullCalendar('option', 'height', calHeight); 
    }); 
}; 

Współczynnik *0.83 zależy od widoku projektowania.

Mam nadzieję, że to pomoże. Adam Shaw's fullcalendar at 100% height and scrollbars

Day view, spanish (as fullcalendar is multilingual - lol

+0

To działa dla mnie –

+0

0.635, ponieważ czynnik zadziałał idealnie dla mnie –

Powiązane problemy