offsetParent ဂုဏ်သတ္တိ

offsetParent ဂုဏ်သတ္တိသည် element တစ်ခုကို ပုံသွင်းရာတွင် အနီးဆုံး မိဘ element ကို ပါဝင်သည်။ ၎င်းသည် CSS ဂုဏ်သတ္တိ position သည် static နှင့် မညီသော အနီးဆုံးမိဘ သို့မဟုတ် အဆိုပါ positioning ရှိသော မိဘမရှိပါက body tag ဖြစ်လိမ့်မည်။

Syntax

javascriptelement.offsetParent;

ဥပမာ

position ဂုဏ်သတ္တိရှိသော မိဘ element ကို static မှ ကွဲပြားစေကာ ရှာဖွေကြည့်ရအောင်။

html<div id="parent3">
  <div id="parent2" style="position: relative">
    <div id="parent1">
      <p id="elem">စာသား</p>
    </div>
  </div>
</div>
javascriptlet elem = document.querySelector('#elem');
console.log(elem.offsetParent.id);

ကုဒ်ကို execute လုပ်ခြင်း၏ ရလဒ်။

javascript'parent2'

ဥပမာ

မိဘ elements များတွင် positioning မရှိပါက offsetParent သည် body ကို ပါဝင်လိမ့်မည်။

html<div>
  <p id="elem">စာသား</p>
</div>
javascriptlet elem = document.querySelector('#elem');
console.log(elem.offsetParent.tagName);

ကုဒ်ကို execute လုပ်ခြင်း၏ ရလဒ်။

javascript'BODY'

ဆက်လက်ဖတ်ရှုရန်

  • offsetParent ဂုဏ်သတ္တိ,
    အထက်ပါသည် positioning ရှိသော မိဘ element ကို ပါဝင်သည်
  • offsetTop ဂုဏ်သတ္တိ,
    အထက်ပါသည် element ၏ အပေါ်ဘက်မှ အကွာအဝေးကို ပါဝင်သည်
  • offsetLeft ဂုဏ်သတ္တိ,
    အထက်ပါသည် element ၏ ဘယ်ဘက်မှ အကွာအဝေးကို ပါဝင်သည်
  • getBoundingClientRect method,
    အထက်ပါသည် element ၏ အကွာအဝေးကို ရှာဖွေပေးသည်