Метад getBoundingClientRect

Метад getBoundingClientRect утрымлівае аб'ект каардынат элемента. Каардынаты разлічваюцца aдносна бачнай часткі старонкі без уліку пракруткі (адносна акна). Гэта значыць як пры ўласцівасці position ў значэнні fixed.

У які вяртаецца аб'екце ўтрымліваюцца ўласцівасці: left, top, right, bottom, width, height. Варта адзначыць, што гэтыя ўласцівасці не маюць нічога агульнага з CSS ўласцівасцямі. У іх утрымліваюцца адлегласці да адпаведных бакоў элемента. Для left/right - ад левай мяжы бачнай вобласці старонкі, а для top/bottom - ад верхняй.

Сінтаксіс

javascriptэлемент.getBoundingClientRect();

Прыклад

Атрымаем каардынаты элемента:

html<div id="elem"></div>
css#elem {
  width: 100px;
  height: 100px;
  border: 1px solid black;
}
javascriptlet elem = document.querySelector('#elem');
console.log(elem.getBoundingClientRect());

Глядзіце таксама

  • уласцівасць offsetParent,
    якое ўтрымлівае бацьку з пазіцыянаваннем
  • уласцівасць offsetTop,
    якое ўтрымлівае зрушэнне элемента зверху
  • уласцівасць offsetLeft,
    якое ўтрымлівае зрушэнне элемента злева
  • метад elementFromPoint,
    якое вяртае элемент па каардынатах