Lastnost event.clientX

Lastnost event.clientX vsebuje koordinate kurzorja miške po osi X. Za določanje koordinat so na voljo tudi lastnosti event.clientY, event.pageX, event.pageY. Oglejmo si razliko med clientX/clientY in pageX/pageY.

Kako delujeta clientX in clientY: če imate okno velikosti 1000 na 1000 pikslov in je miška v sredini, bosta clientX in clientY enaka 500. Če nato drsnik pomaknete vodoravno ali navpično, ne da bi premaknili kurzor, se vrednosti clientX in clientY ne spremenita, saj se štejejo glede na okno in ne dokumenta.

Kako delujeta pageX in pageY: če imate okno velikosti 1000 na 1000 pikslov in je kurzor v sredini, bosta pageX in pageY enaka 500. Če nato drsnik pomaknete 250 pikslov navzdol, bo pageY enak 750. Tako pageX in pageY vsebujeta koordinate dogodka ob upoštevanju drsenja.

Sintaksa

javascriptevent.clientX;

Primer

Pri gibanju miške po strani bomo izpisovali njene koordinate glede na okno brskalnika (clientX in clientY):

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

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

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

Результат:

Glejte tudi