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 screenX schreibgeschützte Eigenschaft des MouseEvent Interfaces liefert die horizontale Koordinate (Offset) des Mauszeigers in Bildschirmkoordinaten.

Hinweis: In einer Multi-Screen-Umgebung werden Bildschirme, die horizontal ausgerichtet sind, als ein einzelnes Gerät behandelt, und somit wird der Bereich des screenX-Werts auf die kombinierte Breite der Bildschirme erweitert.

Wert

Ein double Fließkommawert in Pixeln.

Frühere Versionen der Spezifikation definierten dies als eine ganze Zahl, 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

Ein Ereignis routen

Wenn Sie Ereignisse im Fenster, Dokument oder anderen großen Elementen abfangen, können Sie die Koordinaten dieses Ereignisses (z.B. ein Klick) erfassen und es korrekt routen, 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

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
screenX

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Siehe auch