Својство event.pageX
Својство event.pageX садржи у себи
координате курсора миша по X оси.
За одређивање координата постоје и својства
event.clientX,
event.clientY,
event.pageY.
Хајде да погледамо разлику између 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 садрже координате
догађаја узевши у обзир скроловање.
Синтакса
event.pageX;
Пример
При кретању миша по страници приказиваћемо
његове координате у односу на прозор прегледача
(pageX и pageY):
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.pageX + ' : ' + event.pageY;
});
:
