MouseEvent: screenX-Eigenschaft

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Die schreibgeschützte screenX-Eigenschaft des MouseEvent-Interfaces liefert die horizontale Koordinate (Offset) des Mauszeigers in Bildschirmkoordinaten.

Hinweis: In einer Umgebung mit mehreren Bildschirmen, die horizontal ausgerichtet sind, werden diese Bildschirme als ein einziges Gerät behandelt. Dadurch vergrößert sich der Bereich des screenX-Werts auf die kombinierte Breite der Bildschirme.

Wert

Ein double-Gleitkommawert in Pixeln.

Frühere Versionen der Spezifikation definierten dies als eine Ganzzahl, die sich auf die Anzahl der Pixel bezieht.

Beispiele

Dieses Beispiel zeigt die Koordinaten Ihrer Maus an, wann immer Sie das mousemove-Ereignis auslösen.

HTML

html
<p>Move your mouse to see its position.</p>
<p id="screen-log"></p>

JavaScript

js
let screenLog = document.querySelector("#screen-log");
document.addEventListener("mousemove", logKey);

function logKey(e) {
  screenLog.innerText = `
    Screen X/Y: ${e.screenX}, ${e.screenY}
    Client X/Y: ${e.clientX}, ${e.clientY}`;
}

Ergebnis

Routing eines Ereignisses

Wenn Sie Ereignisse im Fenster, Dokument oder anderen großen Elementen abfangen, können Sie die Koordinaten dieses Ereignisses (z.B. einen Klick) erhalten und es ordnungsgemäß weiterleiten, wie das folgende Beispiel zeigt:

js
function checkClickMap(e) {
  if (e.screenX < 50) doRedButton();
  if (50 <= e.screenX && e.screenX < 100) doYellowButton();
  if (e.screenX >= 100) doRedButton();
}

Spezifikationen

Specification
UI Events
# dom-mouseevent-screenx

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch