ResizeObserver: unobserve() Methode
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2020.
Die unobserve() Methode des ResizeObserver-Interfaces beendet das Beobachten eines angegebenen Element oder SVGElement.
Syntax
js
unobserve(target) Parameter
target-
Ein Verweis auf ein
ElementoderSVGElement, das nicht mehr beobachtet werden soll.
Rückgabewert
Keiner (undefined).
Ausnahmen
Keine.
Beispiele
Der folgende Codeausschnitt stammt aus dem resize-observer-text.html (Quellcode ansehen) Beispiel:
js
const resizeObserver = new ResizeObserver((entries) => { for (const entry of entries) { if (entry.contentBoxSize) { // Checking for chrome as using a non-standard array if (entry.contentBoxSize[0]) { h1Elem.style.fontSize = `${Math.max( 1.5, entry.contentBoxSize[0].inlineSize / 200, )}rem`; pElem.style.fontSize = `${Math.max( 1, entry.contentBoxSize[0].inlineSize / 600, )}rem`; } else { h1Elem.style.fontSize = `${Math.max( 1.5, entry.contentBoxSize.inlineSize / 200, )}rem`; pElem.style.fontSize = `${Math.max( 1, entry.contentBoxSize.inlineSize / 600, )}rem`; } } else { h1Elem.style.fontSize = `${Math.max( 1.5, entry.contentRect.width / 200, )}rem`; pElem.style.fontSize = `${Math.max(1, entry.contentRect.width / 600)}rem`; } } console.log("Size changed"); }); resizeObserver.observe(divElem); checkbox.addEventListener("change", () => { if (checkbox.checked) { resizeObserver.observe(divElem); } else { resizeObserver.unobserve(divElem); } }); Spezifikationen
| Specification |
|---|
| Resize Observer> # dom-resizeobserver-unobserve> |