MouseEvent: clientY-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 clientY-Eigenschaft des MouseEvent-Interfaces liefert die vertikale Koordinate innerhalb des Viewports der Anwendung, an der das Ereignis eingetreten ist (im Gegensatz zur Koordinate innerhalb der Seite).

Beispielsweise führt ein Klick auf den oberen Rand des Viewports immer zu einem Mausereignis mit einem clientY-Wert von 0, unabhängig davon, ob die Seite vertikal gescrollt ist.

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