Svojstvo event.clientX
Svojstvo event.clientX sadrži u
sebi koordinate kursora miša po X osi.
Za određivanje koordinata tu su i svojstva
event.clientY,
event.pageX,
event.pageY.
Pogledajmo razliku između clientX/clientY
i pageX/pageY.
Kako rade clientX i clientY:
ako imate prozor od 1000 puta 1000
piksela, i miš je u centru, onda će clientX
i clientY oba biti jednaki 500. Ako
zatim skrolujete stranicu horizontalno
ili vertikalno, ne pomerajući kursor, vrednosti
clientX i clientY se neće promeniti, jer se računaju
u odnosu na prozor, a ne u odnosu na dokument.
Kako rade pageX i pageY:
ako imate prozor od 1000 puta 1000
piksela, i kursor je u centru, onda
će pageX i pageY biti jednaki 500. Ako
zatim skrolujete stranicu za 250
piksela nadole, onda će pageY postati jednak 750.
Na taj način pageX i pageY sadrže koordinate
dogđaja uzimajući u obzir skrolovanje.
Sintaksa
event.clientX;
Primer
Pri pomeranju miša po stranici ispisivaćemo
njegove koordinate u odnosu na prozor brauzera
(clientX i clientY):
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.clientX + ' : ' + event.clientY;
});
:
