event.clientX xususiyati
event.clientX xususiyati
sichqoncha kursori X o'qi bo'yicha koordinatalarni o'z ichiga oladi.
Koordinatalarni aniqlash uchun shuningdek
event.clientY,
event.pageX,
event.pageY xususiyatlari mavjud.
Keling clientX/clientY bilan
pageX/pageY o'rtasidagi farqni ko'rib chiqaylik.
clientX va clientY qanday ishlaydi:
agar sizda 1000 ga 1000
piksellı oyna bo'lsa va sichqoncha markazda bo'lsa, clientX
va clientY ikkalasi ham 500 ga teng bo'ladi. Agar
siz kursorni harakatlantirmasdan sahifani gorizontal
yoki vertikal aylantirsangiz, clientX va clientY qiymatlari
o'zgarmaydi, chunki ular hujjatga nisbatan emas, balki oynaga nisbatan hisoblanadi.
pageX va pageY qanday ishlaydi:
agar sizda 1000 ga 1000
piksellı oyna bo'lsa va kursör markazda bo'lsa,
pageX va pageY 500 ga teng bo'ladi. Agar
siz sahifani 250
piksel pastga aylantirsangiz, pageY 750 ga teng bo'ladi.
Shunday qilib pageX va pageY aylantirishni hisobga olgan holda
hodisa koordinatalarini o'z ichiga oladi.
Sintaksis
event.clientX;
Misol
Sahifa bo'ylab sichqoncha harakatlanganda uning
brauzer oynasiga nisbatan koordinatalarini
chiqaramiz (clientX va clientY):
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.clientX + ' : ' + event.clientY;
});
: