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
event.clientY;
Eksempel
Ved musebe bevægelse på siden vil vi udskrive
dens koordinater i forhold til browserens vindue
(clientX og clientY):
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.clientX + ' : ' + event.clientY;
});
:
