JavaScript/DOM/Event/resize
Aus SELFHTML-Wiki
JavaScript | DOM | Event
Version vom 4. Juli 2024, 09:18 Uhr von RolfBot (Diskussion | Beiträge) (→top: replaced: <source lang="javascript"> → <syntaxhighlight lang="javascript">, </source> → </syntaxhighlight>)
Der resize-Event-Handler wird für die Überwachung der Fenstergröße verwendet. Dieser Event-Handler tritt ein, wenn der Anwender die Fenstergröße ändert. Sie können diesem Event-Handler eine Funktion zuordnen, die bei Größenänderungen ausgeführt wird.
bubbles |
nein |
---|---|
cancelable |
nein |
mögliche Auslöser | |
Event-Objekt |
Event |
Beispiel
ansehen ...
window.addEventListener('resize', changeSize); function changeSize(){ var w=window.outerWidth; var h=window.outerHeight; var txt='<b>Fenstergröße:</b><br> Breite=' + w + 'px<br> Höhe=' + h+'px'; document.getElementById('ausgabe').innerHTML=txt; }
Empfehlung: Da der resize-Event-Handler bei jeder Pixel-Änderung feuert, sollten Sie auf den Einsatz rechenintensiver DOM-Änderungen verzichten oder mit requestAnimationFrame oder matchMedia realisieren.[1]
Siehe auch
- JavaScript und CSS
- CSS-Eigenschaften auslesen
resizes mit matchMedia()
- CSS-Eigenschaften auslesen
Weblinks
Abgerufen am 1.09.2025
von "http://wiki.selfhtml.org/wiki/JavaScript/DOM/Event/resize"