Vlastnosť event.pageY

Vlastnosť event.pageY obsahuje súradnice kurzora myši po osi Y. Na určenie súradníc existujú aj vlastnosti event.clientX, event.clientY, event.pageX. Pozrime sa na rozdiel medzi clientX/clientY a pageX/pageY.

Ako fungujú clientX a clientY: ak máte okno 1000 na 1000 pixelov a myš je v strede, potom clientX a clientY budú obe rovné 500. Ak potom posuniete stránku horizontálne alebo vertikálne, bez pohybu kurzora, hodnoty clientX a clientY sa nezmenia, pretože sa počítajú vzhľadom na okno, nie na dokument.

Ako fungujú pageX a pageY: ak máte okno 1000 na 1000 pixelov a kurzor je v strede, potom pageX a pageY budú rovné 500. Ak potom posuniete stránku o 250 pixelov nadol, pageY sa stane rovným 750. pageX a pageY teda obsahujú súradnice udalosti berúc do úvahy posúvanie.

Syntax

javascriptevent.pageY;

Príklad

Pri pohybe myši po stránke budeme vypisovať jej súradnice relatívne k oknu prehliadača (pageX a pageY):

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

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

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

Результат:

Pozrite tiež