Свойство event.pageY

Свойството event.pageY съдържа координатите на мишката по оста Y. За определяне на координати съществуват и свойствата event.clientX, event.clientY, event.pageX. Нека разгледаме разликата между clientX/clientY и pageX/pageY.

Как работят clientX и clientY: ако имате прозорец 1000 на 1000 пиксела и мишката е в центъра, то clientX и clientY и двете ще бъдат равни на 500. Ако след това прокрутите страницата хоризонтално или вертикално, без да местите курсора, то стойностите на clientX и clientY няма да се променят, тъй като се отчитат спрямо прозореца, а не документа.

Как работят pageX и pageY: ако имате прозорец 1000 на 1000 пиксела и курсорът е в центъра, то pageX и pageY ще бъдат равни на 500. Ако след това прокрутите страницата с 250 пиксела надолу, то pageY ще стане равно на 750. По този начин pageX и pageY съдържат координатите на събитието, като вземат предвид прокрутката.

Синтаксис

javascriptevent.pageY;

Пример

При движение на мишката по страницата ще извеждаме нейните координати спрямо прозореца на браузъра (pageX и pageY):

html<div id="elem">0 : 0</div>

javascriptlet elem = document.getElementById('elem');

document.addEventListener('mousemove', function(event) {
  elem.innerHTML = event.pageX + ' : ' + event.pageY;
});

Результат:

Вижте също