event.clientX касиети
event.clientX касиети
X огу боюнча чычкан курсордун координаттарын камтыйт.
Координаттарды аныктоо үчүн дагы
event.clientY,
event.pageX,
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.clientX;
Мисал
Барак боюнча чычканды жылдырганда,
анын браузер терезесине салыштырмалуу
(clientX жана clientY) координаттарын чыгарабыз:
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.clientX + ' : ' + event.clientY;
});
:
