JavaScript Ders-14 Obje Pozisyonu Alma
UstaDerslik Soru-Cevap Yararlı Araçlar
arama ikon
Diller
Türkçe Türkçe

bilgi UstaDerslik
Bu uyari kutusudur.
Tamam
Anasayfa
İletişim
Üyeler

JavaScript Ders-14 Obje Pozisyonu Alma

profil
cArleone
BEĞEN(1)
BEĞENME(0)
GÖRÜNTÜLENME(1732)
RAPOR ET
Javascript derslerimize devam ediyoruz.Bu derste objenin sayfanın konumu almayı göreceğiz.Sayfanın sol en üst kısmı başlangıç noktasıdır.Konum olarak top yani üst ve left yani soldan uzaklık bilgilerini alacağız.Bunun için kullanacağımız komut getBoundingClientRect() .Kullanımı ve işlevi jquery position() ile aynı,tek fark jquery'nin yazımı akılda daha kalıcı.

Genel örnek :
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>UstaDerslik</title>
<script type="text/javascript">
function pos(){
var konum=document.getElementById('alan').getBoundingClientRect(),//objeye erişiyoruz ve pozisyon bilgilerini alıp konum değişkenine atıyoruz
left=Math.round(konum.left),//objenin solda ne kadar uzak olduğunu alıyoruz
top=Math.round(konum.top);//objenin yukarıdan uzaklığını alıyoruz.

alert(left)
alert(top)//ekrana basıyoruz.
}
</script>
<style type="text/css">
*{margin:0;padding:0;}
#alan{width:100px;height:100px;margin:auto;margin-top:50px;background:red;}
</style>
</head>
<body onLoad="pos()">

<div id="alan"></div>

</body>
</html>


Yukarıda konumunu alacağımız objeye getElementById ile erişip getBoundingClientRect ile verileri aldık sonra,left ve top değerlerini alıp ekrana bastık.



Kod
Kalın
Vurgu
Resim
Video
Url
CEVAPLA
Tüm Hakları Saklıdır. ©Arleone 2013-2014 UstaDerslik






Giriş
Şifremi Unuttum...
Şifre Talep
  Kuralları Kabul Ediyorum.
Kaydol