ResizeObserverSize: blockSize-Eigenschaft
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit März 2022 browserübergreifend verfügbar.
Die schreibgeschützte Eigenschaft blockSize der ResizeObserverSize-Schnittstelle gibt die Länge des Rahmenkastens des beobachteten Elements in der Block-Dimension zurück. Bei Kästen mit einem horizontalen writing-mode ist dies die vertikale Dimension oder Höhe; wenn der Schreibmodus vertikal ist, ist dies die horizontale Dimension oder Breite.
Hinweis: Eine ausführlichere Erklärung zu Schreibmodi und Block- sowie Inline-Dimensionen finden Sie im Artikel Umgang mit unterschiedlichen Textrichtungen.
Wert
Eine Dezimalzahl, die die Blockgröße in Pixeln darstellt.
Beispiele
In diesem Beispiel geben wir ein Array mit Größeninformationen zurück, indem wir ResizeObserverEntry.contentBoxSize verwenden. Die Eigenschaft blockSize gibt die Block-Dimension des beobachteten Elements zurück.
const resizeObserver = new ResizeObserver((entries) => {
for (const entry of entries) {
const elemSize = entry.contentBoxSize[0];
console.log(elemSize.blockSize); // a decimal
}
});
resizeObserver.observe(divElem);
Spezifikationen
| Spezifikation |
|---|
| Resize Observer # dom-resizeobserversize-blocksize |