offsetTop häsiýeti

offsetTop häsiýeti elementiň ýokarykdan offsetParent garanyşlykda göçürmesini öz içine alýar. offsetParent-dan elementiň çäklerine çenli aralygy öz içine alýar.

Sintaksis

element.offsetTop;

Mysal

Geliň elementiň öz offsetParent-a garanyşlykda göçürmesini tapalyň:

<div id="parent" style="position: relative;">
	<div id="elem" style="position: absolute; top: 100px;"></div>
</div>

let elem = document.querySelector('#elem');
console.log(elem.offsetTop);

Kodyň ýerine ýetirilmegi netijesi:

100

Mysal

margin indentleri hem göçürmä goşulýar:

<div id="parent" style="position: relative;">
	<div id="elem" style="position: absolute; top: 100px; margin: 50px;"></div>
</div>

let elem = document.querySelector('#elem');
console.log(elem.offsetTop);

Kodyň ýerine ýetirilmegi netijesi:

150

Şeýle-de serediň

sol tarapdan elementiň göçürmesini öz içine alýan offsetLeft häsiýeti,
elementiň göçürmesini tapýan getBoundingClientRect metodu,