Javascript ile mouse sayfanın neresinde veya mouse div in hangi pozisyonunda bulmak için jQuery kütüphanesinde bulunan pageX clientX pageY clientY fonksiyonlarını kullanabiliriz. Genellikle mousemove ile kullanma ihtiyacı hissettiğimiz position işlemlerinde e.pageY şeklinde yazdığımızda sayfa genelinde mouse Y pozisyonunu alırız.
Div veya başka bir kutucuk oluşturup kendi içindeki posizyonunu nedir öğrenmek için ise e.pageY-this.offsetTop şeklinde kutumuzun sayfanın neresinde olduğuna bakar aradaki farkı çıkarırız geriye sadece divden sonraki X ve Y kalır.
Koordinat sistemini kullanarak Y pozisyonundan Top (üst) bölümün mesafesini, X pozisyonundan ise Left (sol) ve dolayısıyla yatay düzlemdeki konumunu hesaplamak için kullanırız.
Örnek öngörünüm:
------
------
<script type="text/javascript" src="http://limitsizbilgi.com/js/jquery.min.1.7.1.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){ // sayfa yüklenmesi tamamlanınca işlem yap.
$('#box').mousemove(function(e){
$('#box').html('<strong>Div içi: (' + (e.pageY-this.offsetTop) + ',' + (e.pageX-this.offsetLeft) +') ' + 'Sayfa geneli: (' + (e.pageY+','+e.pageX) + ')</strong>');
});
});
</script>
<div id="box" style="width:300px; height:300px; background:#000; border:solid 1px #FF0; color:#F00;">300x300 Div</div>
Konu (120) ile ilgili admin @ limitsizbilgi.com adresine E-mail gönderebilirsiniz. İsa Şahintürk