myNotlar Logo

event.x ve event.y


Internet Explorer Opera

x ve y özellikleri, pencerenin içerik alanında fare pozisyonunun konumunu döndürürler. event.x soldan uzaklığı, event.y üstten olan uzaklığı piksel olarak verir.

Bu özelliklerin diğer tarayıcılar için alternatifleri clientX ve clientY özellikleridir.

Sözdizimi

yatay = event.x

dikey = event.y

Dönüş Değeri

yatayFare işaretçisinin, içerik alanındaki soldan uzaklığı.
dikeyFare işaretçisinin, içerik alanındaki üstten uzaklığı.

Aşağıdaki örnek, fare işaretçisinin, sistem ekranına, komple doküman alanına ve tarayıcının görünen içerik alanına göre konum değerlerini göstermektedir.

<style type="text/css">
#bilgiKutu {
    width:250px;
}
#anaTablo {
    width:300px;
    height:150px;
}
#ornekTablo, #ornekDiv {
    width:100%;
    height:100%;    
    text-align:center;
    color:white;
    font-weight:bold;
}
</style>

<table id="anaTablo"><tr><td width="50%">

<table id="ornekTablo" style="background-color:#55AA55;"><tr><td>
Tablo Sütunu
</td></tr></table>

</td><td width="50%">

<div id="ornekDiv" style="background-color:#5555AA; display:block;"> DIV </div>

</td></tr></table>

<div id="bilgiKutu"></div>

<script type="text/javascript">

var bilgiKutu = document.getElementById('bilgiKutu');

function yakala()
{
    var yazilacak = "offsetX : " + event.offsetX +
                "<br/>offsetY : " + event.offsetY +
                "<br/>screenX : " + event.screenX +
                "<br/>screenY : " + event.screenY +
                "<br/>X : " + event.x +
                "<br/>Y : " + event.y;
                
    bilgiKutu.innerHTML = yazilacak;
}

document.onmousemove = yakala;
</script>
Test Edin
Tablo Sütunu
DIV
İlgili Başlıklar
 
myNotlar Hakkında
Telif Hakkı © 2007-2009 mynotlar.com Tüm Hakları Saklıdır. Kopyalanamaz. Yayınlanamaz.
E-Posta : support@myNotlar.com

| Tek Kişilik Oyunlar | Sudoku | Oyunlar |