Element.offsetTop

offsetTop özelliği, elementin üstten temel elementine olan uzaklığı verir.

Sözdizimi

usttenPoz = element.offsetTop

Dönüş Değeri

usttenPoz

Elementin içinde bulunduğu ana elementine üstten olan uzaklığıdır.

Aşağıdaki örnek, bir tablo hücresi içinde bulunan div elementinin kenar pay genişliği (margin) değiştirildiği zaman offsetTop özelliğindeki değişikliği göstermektedir.

<script type="text/javascript">
var kenarPayi = 0;
function Yukselt()
{
   document.getElementById('OrnekKutu').style.margin = ++kenarPayi;
   document.getElementById('OrnBilgKutu').innerHTML = "offsetTop değeri : " + 
                              document.getElementById('OrnekKutu').offsetTop;
}

function Azalt()
{
   kenarPayi = kenarPayi > 0 ? --kenarPayi : 0;
   document.getElementById('OrnekKutu').style.margin = kenarPayi;
   document.getElementById('OrnBilgKutu').innerHTML = "offsetTop değeri : " + 
                              document.getElementById('OrnekKutu').offsetTop;
}

</script>


<input type="button" value="Arttır" onClick="Yukselt()" />
<input type="button" value="Azalt" onClick="Azalt()" />
<table>
   <tr>
      <td id="OrnekHucre" style="padding:10px; background-color:#c0c0c0;">
      <div id="OrnekKutu" style="   
      border:solid 5px #a0a0c0;
      background-color:#e0e0e0;
      width:100px;
      height:100px;"></div>
     </td>
   </tr>
</table>

<div id="OrnBilgKutu"></div>

Test edin

İlgili Başlıklar