Limited availability
Die devicePixelContentBoxSize schreibgeschützte Eigenschaft der ResizeObserverEntry-Schnittstelle gibt ein Array zurück, das die GröÃe in Geräte-Pixeln des beobachteten Elements enthält, wenn der Rückruf ausgeführt wird.
Ein Array, das Objekte mit der neuen GröÃe des beobachteten Elements in Geräte-Pixeln enthält. Das Array ist erforderlich, um Elemente zu unterstützen, die mehrere Fragmente haben, was in Mehrspalten-Szenarien vorkommt. Jedes Objekt im Array enthält zwei Eigenschaften:
blockSize
Die GröÃe des Content-Box in Geräte-Pixeln der Blockdimension des beobachteten Elements. Für Boxen 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.
inlineSize
Die GröÃe der Content-Box in Geräte-Pixeln der Inline-Richtung des beobachteten Elements. 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 weitere Informationen über Schreibmodi und Block- und Inline-Dimensionen lesen Sie Umgang mit verschiedenen Textausrichtungen.
BeispieleDas folgende Beispiel stammt aus dem Artikel Pixel-perfect rendering with devicePixelContentBox. Da die Rückruffunktion eines ResizeObserver nach dem Layout, aber vor dem Paint aufgerufen wird, bietet sich die Gelegenheit, die genaue GröÃe in physischen Pixeln zu protokollieren, um eine Eins-zu-eins-Zuordnung der Canvas-Pixel zu physischen Pixeln sicherzustellen.
const observer = new ResizeObserver((entries) => {
const entry = entries.find((entry) => entry.target === canvas);
canvas.width = entry.devicePixelContentBoxSize[0].inlineSize;
canvas.height = entry.devicePixelContentBoxSize[0].blockSize;
/* ⦠render to canvas ⦠*/
});
observer.observe(canvas, { box: "device-pixel-content-box" });
Diese Seite wurde automatisch aus dem Englischen übersetzt.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4