ResizeObserverSize: inlineSize 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 inlineSize schreibgeschützte Eigenschaft der ResizeObserverSize-Schnittstelle gibt die Länge des Border-Box des beobachteten Elements in der Inline-Dimension zurück. Für Boxen mit einem horizontalen writing-mode ist dies die horizontale Dimension oder Breite; wenn der Schreibmodus vertikal ist, ist dies die vertikale Dimension oder Höhe.
Hinweis: Für eine ausführlichere Erklärung von Schreibmodi sowie Block- und Inline-Dimensionen lesen Sie Umgang mit verschiedenen Textausrichtungen.
Wert
Ein Dezimalwert, der die Inline-Größe in Pixeln darstellt.
Beispiele
In diesem Beispiel geben wir ein Array von Größeninformationen mit ResizeObserverEntry.contentBoxSize zurück. Die inlineSize-Eigenschaft gibt die Inline-Dimensionsgröße des beobachteten Elements zurück.
const resizeObserver = new ResizeObserver((entries) => {
for (const entry of entries) {
const elemSize = entry.contentBoxSize[0];
console.log(elemSize.inlineSize); // a decimal
}
});
resizeObserver.observe(divElem);
Spezifikationen
| Spezifikation |
|---|
| Resize Observer # dom-resizeobserversize-inlinesize |