⌘Ctrlk

✨mouse event coords

browser ⟩ event ⟩ type ⟩ mouse ⟩ example ⟩ coords

compare .pageX , .clientX , .screenX of a mouse event.

replit ⟩ mouse event coords

const { log } = console

// ⭐️ import
import { $ } from './js/ext/Node_ext.js'; // Node + ext
// --------------------------------------------------------------------

const info = $("#info");

document.onmousemove = (e) => {
    info.innerHTML = `<ul><li>screen: (${e.screenX}, ${e.screenY})`
        + `<li>page: (${e.pageX}, ${e.pageY})`
        + `<li>client: (${e.clientX}, ${e.clientY})</ul>`;
};

https://replit.com/@pegasusroe/mouse-event-coords#index.jsreplit.com

Previousmouse event examples Nexttouch event

Last updated 3 years ago