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