Īpašība event.pageY

Īpašība event.pageY satur peles kursora Y ass koordinātes. Koordinātu noteikšanai ir arī īpašības event.clientX, event.clientY, event.pageX. Apskatīsim atšķirību starp clientX/clientY un pageX/pageY.

Kā strādā clientX un clientY: ja jums ir logs 1000 uz 1000 pikseļiem, un pele atrodas centrā, tad clientX un clientY abi būs vienādi ar 500. Ja jūs pēc tam ritināsiet lapu horizontāli vai vertikāli, nepārvietojot kursoru, tad vērtības clientX un clientY nemainīsies, jo tie tiek skaitīti attiecībā pret logu, nevis dokumentu.

Kā strādā pageX un pageY: ja jums ir logs 1000 uz 1000 pikseļiem, un kursors atrodas centrā, tad pageX un pageY būs vienādi ar 500. Ja jūs pēc tam ritināsiet lapu par 250 pikseļiem uz leju, tad pageY kļūs vienāds ar 750. Tādējādi pageX un pageY satur notikuma koordinātas ņemot vērā ritināšanu.

Sintakse

javascriptevent.pageY;

Piemērs

Pārvietojot peli pa lapu, mēs izvadīsim tās koordinātas attiecībā pret pārlūkprogrammas logu (pageX un pageY):

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

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

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

Результат:

Skatiet arī