event.pageX қасиеті
event.pageX қасиеті
X осі бойынша тінтуір курсорының координаттарын қамтиды.
Координаттарды анықтау үшін сонымен қатар
event.clientX,
event.clientY,
event.pageY қасиеттері бар.
clientX/clientY
және pageX/pageY арасындағы айырмашылықты қарастырайық.
clientX және clientY қалай жұмыс істейді:
егер сізде 1000 бойынша 1000
пиксель терезесі болса, және тінтуір ортада болса, онда clientX
және clientY екеуі де 500 тең болады. Егер
сіз курсорды жылжытпай, бетті көлденең немесе
тігінен айналдырсаңыз, онда clientX және clientY мәндері
өзгермейді, себебі олар құжатқа емес,
терезеге қатысты есептеледі.
pageX және pageY қалай жұмыс істейді:
егер сізде 1000 бойынша 1000
пиксель терезесі болса, және курсор ортада болса, онда
pageX және pageY 500 тең болады. Егер
сіз содан кейін бетті 250
пиксель төмен айналдырсаңыз, онда pageY 750 тең болады.
Осылайша pageX және pageY оқиғаның координаттарын
айналдыруды ескере отырып қамтиды.
Синтаксис
event.pageX;
Мысал
Тінтуірді бет бойынша жылжытқан кезде
олардың браузер терезесіне қатысты координаттарын
шығарамыз (pageX және pageY):
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.pageX + ' : ' + event.pageY;
});
:
