Window.mozInnerScreenY — Eigenschaft · JavaScript-Referenz

Signatur

Window.mozInnerScreenY

Beschreibung

Die schreibgeschützte Eigenschaft window.mozInnerScreenY liefert den vertikalen Abstand der oberen linken Ecke des Viewports (also des Inhaltsbereichs ohne Tab-Leiste, Adressleiste und sonstige Browser-Oberfläche) vom oberen Bildschirmrand. Der Wert wird in CSS-Pixeln angegeben und kann Nachkommastellen haben.

Im Gegensatz dazu beschreibt window.screenY die Position des äußeren Browserfensters, also einschließlich Titelleiste und Symbolleisten. Die Differenz mozInnerScreenY - screenY entspricht damit ungefähr der Höhe der Browser-Oberfläche oberhalb des Seiteninhalts.

Nützlich ist die Eigenschaft vor allem, wenn Koordinaten aus dem Dokument (etwa aus getBoundingClientRect() oder MouseEvent.clientY) in absolute Bildschirmkoordinaten umgerechnet werden müssen – zum Beispiel, um ein Pop-up-Fenster exakt neben einem Element zu öffnen. Zusammen mit mozInnerScreenX bildet sie das Paar für die horizontale Position.

Da es sich um eine proprietäre Gecko-Erweiterung handelt, sollte man sie ausschließlich per Feature-Erkennung nutzen und für andere Browser eine Näherung (z. B. über MouseEvent.screenY - clientY) bereitstellen.

Rückgabewert

Typ

number

Beschreibung

Y-Koordinate der oberen linken Viewport-Ecke relativ zum Bildschirm in CSS-Pixeln (Gleitkommazahl). In Browsern ohne Unterstützung ist die Eigenschaft undefined.

Beispiele

Viewport-Position auslesen (mit Feature-Erkennung)

if ('mozInnerScreenY' in window) {
  console.log(`Viewport beginnt bei y = ${window.mozInnerScreenY}px`);
  console.log(`Browser-Oberfläche oben: ${window.mozInnerScreenY - window.screenY}px`);
} else {
  console.log('mozInnerScreenY wird nicht unterstützt');
}

Viewport beginnt bei y = 110px Browser-Oberfläche oben: 85px

Element-Position in Bildschirmkoordinaten umrechnen

const toScreenY = (el) => {
  const rect = el.getBoundingClientRect();
  return window.mozInnerScreenY + rect.top;
};

const button = document.querySelector('button');
console.log(`Button-Oberkante auf dem Bildschirm: ${toScreenY(button)}px`);

Button-Oberkante auf dem Bildschirm: 342px

Browserübergreifende Näherung per Mausereignis

let viewportScreenY = window.mozInnerScreenY;

document.addEventListener('mousemove', (event) => {
  // Fallback: Differenz aus Bildschirm- und Client-Koordinate
  viewportScreenY = window.mozInnerScreenY ?? (event.screenY - event.clientY);
}, { once: true });

document.addEventListener('click', () => {
  const popup = window.open('', 'info', `width=300,height=200,top=${Math.round(viewportScreenY ?? 0)}`);
  popup?.document.write('<p>Hallo</p>');
});

// Wichtig · Fallstricke

Nicht standardisiert: Nur Firefox (Gecko) unterstützt mozInnerScreenY. Chrome, Edge und Safari liefern undefined – immer Feature-Erkennung verwenden.
Der Wert ist in CSS-Pixeln angegeben und hängt vom Zoomfaktor ab; bei Seiten-Zoom oder devicePixelRatio ≠ 1 entspricht er nicht den physischen Bildschirmpixeln.
Bei Mehrbildschirm-Setups kann der Wert negativ sein oder größer als screen.height, je nach Anordnung der Monitore.
Unter Wayland oder in manchen Sandbox-/Datenschutzmodi (z. B. privacy.resistFingerprinting) liefert Firefox möglicherweise gerundete oder fiktive Werte.
Die Eigenschaft ist schreibgeschützt; Zuweisungen werden ignoriert.
Das Beispiel mit document.write dient nur der Demonstration – für echte Inhalte sichere DOM-Methoden statt ungeprüftem HTML verwenden (XSS-Risiko).

Siehe auch

Window.mozInnerScreenX Window.screenY Window.screenTop Window.innerHeight Element.getBoundingClientRect() MouseEvent.screenY VideoTrackGenerator.track