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>)

(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)
Wechseln zu: Navigation, Suche
Disambig-dark.svg Der Begriff resize ist mehrdeutig.
Für die gleichnamige CSS-Eigenschaft siehe CSS/Eigenschaften/resize.

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

body

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

Weblinks

  1. MDN: resize

Abgerufen am 1.09.2025
von "http://wiki.selfhtml.org/wiki/JavaScript/DOM/Event/resize"