This page was translated from English by the community. Learn more and join the MDN Web Docs community.
MouseEvent.screenX
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since июль 2015 г..
screenX - read-only свойство интерфейса события MouseEvent, соответствующее горизонтальной координате (смещению) указателя мыши в глобальных (экранных) координатах.
Синтаксис
var x = instanceOfMouseEvent.screenX
Возвращаемое значение
Значение с плавающей точкой типа double. В ранних версиях этой спецификации определялось как целое число, соответствующее количеству пикселей. Подробнее см. раздел "Совместимость с браузерами".
Пример
Этом примере демонстрирует координаты вашей мыши в случае получения события mousemove.
HTML
<p>Подвигайте мышью, чтобы увидеть положение её курсора.</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}`;
}
Результат выполнения
Обработка события
Когда вы отлавливаете события на окне, документе или других элементах, имеющих размер, вы можете получить координаты этого события (например, клика), и обработать его соответствующим образом, например, так, как в этом примере:
function checkClickMap(e) {
if (e.screenX < 50) doRedButton();
if (50 <= e.screenX && e.screenX < 100) doYellowButton();
if (e.screenX >= 100) doRedButton();
}
Спецификации
| Specification |
|---|
| Pointer Events> # dom-mouseevent-screenx> |
Совместимость с браузерами
Enable JavaScript to view this browser compatibility table.