getBoundingClientRect

elem.getBoundingClientRect()

Расстояния до элемента относительно верхней и левой стороны viewport а также размеры элемента без margin, но с учетом scroll элемента.

Расстояния до viewport относительны. При прокрутке экрана такие расстояния могут быть отрицательными, если элемент (или его часть) окажется вне видимости экрана

top - относительно верхней границы viewport (изменяются при scroll)
right относительно левой границы viewport (изменяются при scroll
bottom - относительно верхней границы viewport (изменяются при scroll)
left - относительно левой границы viewport (изменяются при scroll)
width - ширина блока без margin, включая ширину scroll
height - высота блока без margin, включая ширину scroll

element
element.getBoundingClientRect().top
element.getBoundingClientRect().right
element.getBoundingClientRect().bottom
element.getBoundingClientRect().left
element.getBoundingClientRect().width
element.getBoundingClientRect().height