Sifat event.clientY
Sifat event.clientY mengandungi
dalamnya koordinat kursor tetikus pada paksi Y.
Untuk menentukan koordinat terdapat juga sifat
event.clientX,
event.pageX,
event.pageY.
Mari kita lihat perbezaan antara clientX/clientY
dan pageX/pageY.
Bagaimana clientX dan clientY berfungsi:
jika anda mempunyai tetingkap 1000 pada 1000
piksel, dan tetikus berada di tengah, maka clientX
dan clientY kedua-duanya akan sama 500. Jika
anda kemudian menatal halaman secara mendatar
atau menegak, tanpa menggerakkan kursor, maka nilai
clientX dan clientY tidak akan berubah, kerana dikira
secara relatif kepada tetingkap, bukan dokumen.
Bagaimana pageX dan pageY berfungsi:
jika anda mempunyai tetingkap 1000 pada 1000
piksel, dan kursor berada di tengah, maka
pageX dan pageY akan sama 500. Jika
anda kemudian menatal halaman 250
piksel ke bawah, maka pageY akan menjadi 750.
Oleh itu pageX dan pageY mengandungi koordinat
peristiwa dengan mengambil kira penatalan.
Sintaks
event.clientY;
Contoh
Semasa pergerakan tetikus di halaman, kami akan memaparkan
koordinatnya relatif kepada tetingkap pelayar
(clientX dan clientY):
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.clientX + ' : ' + event.clientY;
});
:
