Eienskap event.pageX
Eienskap event.pageX bevat die
koördinate van die muiswyser op die X-as.
Vir die bepaling van koördinate is daar ook eienskappe
event.clientX,
event.clientY,
event.pageY.
Kom ons kyk na die verskil tussen clientX/clientY
en pageX/pageY.
Hoe clientX en clientY werk:
as jy 'n venster van 1000 by 1000
pixels het, en die muis is in die middel, dan sal clientX
en clientY albei gelyk wees aan 500. As
jy dan die bladsy horisontaal
of vertikaal blaai, sonder om die wyser te beweeg, sal die waardes
van clientX en clientY nie verander nie, want hulle word gemeet
relatief tot die venster, nie die dokument nie.
Hoe pageX en pageY werk:
as jy 'n venster van 1000 by 1000
pixels het, en die wyser is in die middel, dan
sal pageX en pageY gelyk wees aan 500. As
jy dan die bladsy met 250
pixels afwaarts blaai, sal pageY gelyk word aan 750.
Dus bevat pageX en pageY die koördinate van die
gebeurtenis met inagneming van blaai.
Sintaksis
event.pageX;
Voorbeeld
Tydens die beweging van die muis oor die bladsy, sal ons sy
koördinate relatief tot die blaaiervenster uitskryf
(pageX en pageY):
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.pageX + ' : ' + event.pageY;
});
:
