offsetLeft ගුණය

offsetLeft ගුණය offsetParent සාපේක්ෂව මූලද්‍රව්‍යයේ වම් විස්ථාපනය අඩංගු කරයි. offsetParent වෙතින් මූලද්‍රව්‍යයේ මායිම දක්වා ඇති දුර අඩංගු වේ.

වාක්‍ය රචනා ක්‍රමය

javascriptමූලද්‍රව්‍යය.offsetLeft;

උදාහරණය

තම ගති ලක්ෂණයට සාපේක්ෂව මූලද්‍රව්‍යයේ විස්ථාපනය සොයා බලමු offsetParent:

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

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

javascript100

උදාහරණය

margin ඉඩ සංයෝජනයද විස්ථාපනයට එකතු වේ:

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

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

javascript150

මෙයද බලන්න

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