Omadus event.pageX
Omadus event.pageX sisaldab
hiirekursori koordinaate X-teljel.
Koordinaatide määramiseks on ka omadused
event.clientX,
event.clientY,
event.pageY.
Vaatame erinevust clientX/clientY
ja pageX/pageY vahel.
Kuidas clientX ja clientY töötavad:
kui teil on aken 1000 korda 1000
pikslit, ja hiir on keskele asetatud, siis clientX
ja clientY on mõlemad võrdsed 500-ga. Kui
te seejärel kerite lehte horisontaalselt
või vertikaalselt, liigutamata kursorit, siis väärtused
clientX ja clientY ei muutu, kuna need loetakse
akna suhtes, mitte dokumendi suhtes.
Kuidas pageX ja pageY töötavad:
kui teil on aken 1000 korda 1000
pikslit, ja kursor on keskele asetatud, siis
pageX ja pageY on võrdsed 500-ga. Kui
te seejärel kerite lehte 250
piksli võrra alla, siis pageY muutub võrdseks 750-ga.
Seega pageX ja pageY sisaldavad sündmuse koordinaate
arvestades kerimist.
Süntaks
event.pageX;
Näide
Hiire liigutamisel lehel kuvame
selle koordinaadid brauseri akna suhtes
(pageX ja pageY):
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.pageX + ' : ' + event.pageY;
});
:
