Атрибут MouseEvent pageX

События DOM MouseEvent

Определение и использование

Когда событие мыши срабатывает, атрибут pageX возвращает горизонтальную координату курсора мыши (относительно документа).

Документ - это веб-страница.

Совет:Чтобы получить вертикальную координату курсора мыши (относительно документа), используйте Атрибут pageY.

Комментарий:Этот атрибут является только читаемым.

Комментарий:Этот атрибут не стандартизирован, но он работает в большинстве основных браузеров.

Пример

Пример 1

Вывод координат курсора мыши при нажатии на кнопку мыши на элементе:

var x = event.pageX;     // Получение горизонтальной координаты
var y = event.pageY;     // Получение вертикальной координаты
var coor = "X coords: " + x + ", Y coords: " + y;

Попробуйте сами

Пример 2

Вывод координат курсора мыши при движении по элементу:

var x = event.pageX;
var y = event.pageY; 
var coor = "X coords: " + x + ", Y coords: " + y;
document.getElementById("demo").innerHTML = coor;

Попробуйте сами

Пример 3

Демонстрация различий между pageX и pageY, а также screenX и screenY:

var pX = event.screenX;
var cX = event.pageX;
var pY = event.screenY;
var cY = event.pageY;
var coords1 = "page - X: " + pX + ", Y coords: " + pY;
var coords2 = "screen - X: " + cX + ", Y coords: " + cY;

Попробуйте сами

Синтаксис

event.pageX

Технические детали

Возврат значения: Число, представляющее горизонтальную координату курсора мыши в пикселях.
Версия DOM: Нет.

Поддержка браузеров

Свойства Chrome IE Firefox Safari Opera
pageX Поддержка 12.0 Поддержка Поддержка Поддержка

Соответствующие страницы

Руководство HTML DOM:Свойство pageY MouseEvent

Руководство HTML DOM:Свойство clientX MouseEvent

Руководство HTML DOM:Свойство clientY MouseEvent

Руководство HTML DOM:Свойство screenX MouseEvent

Руководство HTML DOM:Свойство screenY MouseEvent

События DOM MouseEvent