Top layer

Die top layer ist eine spezifische Schicht, die die gesamte Breite und Höhe des Viewports abdeckt und über allen anderen Schichten in einem Webdokument liegt. Sie wird vom Browser erstellt, um Elemente zu enthalten, die über allen anderen Inhalten auf der Seite erscheinen sollen.

Elemente, die in der top layer platziert werden, erzeugen einen neuen stapelnden Kontext, ebenso wie ihre entsprechenden ::backdrop Pseudo-Elemente.

Elemente, die in der top layer erscheinen, umfassen:

• Vollbild-Elemente, d.h. Elemente, die durch einen erfolgreichen Aufruf von Element.requestFullscreen() im Vollbildmodus angezeigt werden.
• <dialog>-Elemente, die als modale Dialoge über einen erfolgreichen Aufruf von HTMLDialogElement.showModal() angezeigt werden.
• Popover-Elemente, die über einen erfolgreichen Aufruf von HTMLElement.showPopover() angezeigt werden.

Einige Browser, wie Chrome, zeigen Elemente, die in der top layer platziert sind, in einem speziellen DOM-Baumeintrag an. Beispiel:

Beachten Sie, dass die top layer ein internes Browserkonzept ist und nicht direkt aus dem Code heraus manipuliert werden kann. Sie können mit CSS und JavaScript auf Elemente in der top layer abzielen, jedoch nicht auf die top layer selbst.