MouseEvent: clientX Eigenschaft

Baseline Widely available

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

Die schreibgeschützte clientX-Eigenschaft des MouseEvent-Interfaces liefert die horizontale Koordinate innerhalb des Anwendungs-Viewports, an der das Ereignis auftrat (im Gegensatz zur Koordinate innerhalb der Seite).

Beispielsweise wird ein Klick auf den linken Rand des Viewports immer ein Mausereignis mit einem clientX-Wert von 0 ergeben, unabhängig davon, ob die Seite horizontal gescrollt wurde oder nicht.

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

JavaScript

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}`; }