offsetTop ගුණය

offsetTop ගුණයේ මූලද්‍රව්‍යයේ ඉහළින් offsetParent සම්බන්ධයෙන් ඉඩ ප්‍රමාණය අඩංගු වේ. offsetParent සිට මූලද්‍රව්‍යයේ සීමාව දක්වා දුර අඩංගු වේ.

වාග් රීතිය

javascriptmuladrawyaya.offsetTop;

නිදර්ශනය

තමන්ගේ offsetParent සම්බන්ධයෙන් මූලද්‍රව්‍යයේ ඉඩ ප්‍රමාණය සොයා ගනිමු:

html<div id="parent" style="position: relative;">
  <div id="elem" style="position: absolute; top: 100px;"></div>
</div>
javascriptlet elem = document.querySelector('#elem');
console.log(elem.offsetTop);

කේතය ක්‍රියාත්මක කිරීමේ ප්‍රතිඵලය:

javascript100

නිදර්ශනය

margin ඉඩ ප්‍රමාණය ද ඉඩ ප්‍රමාණයට එකතු වේ:

html<div id="parent" style="position: relative;">
  <div id="elem" style="position: absolute; top: 100px; margin: 50px;"></div>
</div>
javascriptlet elem = document.querySelector('#elem');
console.log(elem.offsetTop);

කේතය ක්‍රියාත්මක කිරීමේ ප්‍රතිඵලය:

javascript150

මෙයත් බලන්න

  • offsetLeft ගුණය,
    එහි වම්පසින් මූලද්‍රව්‍යයේ ඉඩ ප්‍රමාණය අඩංගු වේ
  • getBoundingClientRect ක්‍රමය,
    මූලද්‍රව්‍යයේ ඉඩ ප්‍රමාණය සොයයි