Egenskaben event.clientY

Egenskaben event.clientY indeholder musemarkørens koordinater langs Y-aksen. For at bestemme koordinaterne er der også egenskaberne event.clientX, event.pageX, event.pageY. Lad os se forskellen mellem clientX/clientY og pageX/pageY.

Sådan fungerer clientX og clientY: hvis du har et vindue på 1000 gange 1000 pixels, og musen er i midten, så vil clientX og clientY begge være lig med 500. Hvis du derefter scroller siden vandret eller lodret, uden at flytte markøren, så vil værdierne for clientX og clientY ikke ændre sig, fordi de tælles i forhold til vinduet, ikke dokumentet.

Sådan fungerer pageX og pageY: hvis du har et vindue på 1000 gange 1000 pixels, og markøren er i midten, så vil pageX og pageY være lig med 500. Hvis du derefter scroller siden 250 pixels ned, så vil pageY blive lig med 750. Således indeholder pageX og pageY begivenhedens koordinater med scrolling taget i betragtning.

Syntaks

javascriptevent.clientY;

Eksempel

Ved musebe bevægelse på siden vil vi udskrive dens koordinater i forhold til browserens vindue (clientX og clientY):

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

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

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

Результат:

Se også