getBoundingClientRect usuly
getBoundingClientRect usuly
elementiň koordinata objektdir. Koordinatalar
sahypanyň görnüşli bölegine görä
sürüşdirmesiz (penire göre) hasaplanylýar. Ýagny
position
hassasyndaky fixed bahasy ýaly.
Gaýdylýan objektdäki hasaplar: left,
top, right, bottom, width, height.
Belläp geçmeli, bu hasaplaryň CSS hasaplary bilen
hiç hili baglanyşygy ýok. Olarda elementiň degişli
taraplaryna çenli uzaklyklar bar.
left/right üçin - sahypanyň görnüşli
böleginiň çep serhedinden, top/bottom üçin bolsa ýokarky serhedinden.
Sintaksis
javascriptelement.getBoundingClientRect();
Mysal
Elementiň koordinatalaryny alaly:
html<div id="elem"></div>css#elem {
width: 100px;
height: 100px;
border: 1px solid black;
}javascriptlet elem = document.querySelector('#elem');
console.log(elem.getBoundingClientRect());
Şeýle-de serediň
-
offsetParenthassasy,
ýerleşýän ýerini alýan ata-kesesi -
offsetTophassasy,
elementiň ýokardan ýerini alýar -
offsetLefthassasy,
elementiň çepden ýerini alýar -
elementFromPointusuly,
koordinatalar boýunça element yzyna gaytarýar