event.clientY Özelliği
event.clientY özelliği,
fare imlecinin Y eksenindeki koordinatlarını içerir.
Koordinatları belirlemek için ayrıca
event.clientX,
event.pageX,
event.pageY
özellikleri de vardır.
clientX/clientY ile
pageX/pageY
arasındaki farka bir göz atalım.
clientX ve clientY nasıl çalışır:
eğer 1000 x 1000
piksel boyutunda bir pencereniz varsa ve fare ortadaysa, clientX
ve clientY her ikisi de 500 olacaktır. Eğer
daha sonra imleci hareket ettirmeden sayfayı yatay
veya dikey olarak kaydırırsanız,
clientX ve clientY değerleri değişmeyecektir, çünkü bunlar belgeye göre değil,
pencereye göre ölçülür.
pageX ve pageY nasıl çalışır:
eğer 1000 x 1000
piksel boyutunda bir pencereniz varsa ve imleç ortadaysa,
pageX ve pageY 500 olacaktır. Eğer
daha sonra sayfayı aşağı doğru 250
piksel kaydırırsanız, pageY 750 olacaktır.
Böylece pageX ve pageY, kaydırma dikkate alınarak
olayın koordinatlarını içerir.
Sözdizimi
event.clientY;
Örnek
Sayfa üzerinde fare hareket ettiğinde,
tarayıcı penceresine göre koordinatlarını
(clientX ve clientY) yazdıralım:
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.clientX + ' : ' + event.clientY;
});
:
