clientX ve clientY

clientX özelliği, pencerenin içerik alanında fare işaretçisinin soldan olan uzaklığını, clientY özelliği ise üstten olan uzaklığını verir. Firefox ve Opera tarayıcılarında sadece okunabilir olan bu özelliklere Internet Explorer tarayıcısında değer atanabilir.

Sözdizimi

yatay = event.clientX

dikey = event.clientY

Dönüş Değeri

clientX ve clientY değerleri daima pencerenin görünen içeriğini hesaplayarak değer döndürürler. Sürükleme çubukları farklı konumlara sürüklense dahi pencerenin görünen içerik alanının sol-üst noktası her ikisi içinde daima '0' (sıfır) olacaktır.

Aşağıdaki örnek, fare işaretçisinin sayfa üzerinde bulunduğu konumların clientX ve clientY özellikleri ile dinamik olarak öğrenilmesini göstermektedir.

<div id="ornekDiv" style="width:200px; height:40px; background-color:#CCDDFF; padding:10px;">

</div>

<script type="text/javascript">

var div = document.getElementById('ornekDiv');

function fareOku(olay) {
	olay = olay || event;
	var yazilacak = "Soldan = " + olay.clientX + "<br/>" + "Üstten = " + olay.clientY;
	div.innerHTML = yazilacak;
}

document.onmousemove = fareOku;

</script>

Canlı Sonuç

• event.x ve event.y
• layerX ve layerY
• offsetX ve offsetY
• pageX ve pageY
• screenX ve screenY