Je to síce prasáreň, ale občas je to treba: Reagovať skriptom na zmenu veľkosti okna. Nič sa nedá robiť, treba sa s tým popasovať.
document.onResize VS window.onResize
Implementácia onResize eventu nie je v rôznych browseroch jednotná. Niektoré ju vešajú na dokument, niektoré na okno. A potom sú aj také (Opera), ktoré to alibisticky všajú všade:
document.onResize
- Internet Explorer
- Opera
window.onResize
- Firefox
- Opera
- Safari
Správne volanie eventu
Ako teda správne volať event onResize? Rozhodne by bola chyba detekovať browser. Vždy treba detekovať prítomnosť metódy. Kvôli obojpohlavnosti Opery by tiež bola chyba volať to aj nad dokumentom aj nad oknom – v Opere by sa to totiž spustilo dvakrát.
V Prototype sa teda tento event jednoducho zavesí takto:
Event.observe( document.onresize ? document : window, "resize", function() {
// obsah resize eventu
} );
Obdobné to bude vo všetkých ostatných knižniciach.
Pár praktických informácií
Na čo onResize reaguje?
onResize event reaguje na všetky zmeny veľkosti viewportu. To znamená:
- fyzická zmena okna (ťahaním za okraje a pod.)
- zmena veľkosti okna skriptom (ak to browser umožňuje)
- obnovenie z maxima (restore down… proste to stredné tlačítko medzi minimalizáciou a zatvorením) / maximalizácia okna
- prepnutie do / z fullscreenu
- zobrazenie / schovanie sidebarov, toolbarov a pod.
- ak je okno prehliadača maximalizované, onResize zareaguje aj na zmenu rozlíšenia obrazovky!
Na čo onResize nereaguje?
- minimalizácia okna
- zmena pozície okna (preťahovaním myšou alebo skriptom)
- skrolovanie
- keď sa zmení veľkost BODY tak, že sa zobrazí alebo schová scrollbar, nepovažuje sa to za onResize
