Как использовать метод getBoundingClientRect для определения положения элементов на странице?

Метод getBoundingClientRect позволяет получить размеры элемента и его позицию относительно области просмотра. myrusakov.ru Синтаксис использования: элемент.getBoundingClientRect(). code.mu

Метод возвращает объект DOMRect, который содержит следующие свойства: myrusakov.ru

• top — расстояние от верхней границы элемента до верхней границы области просмотра; myrusakov.ru
• right — расстояние от правой границы элемента до левой границы области просмотра; myrusakov.ru
• bottom — расстояние от нижней границы элемента до верхней границы области просмотра; myrusakov.ru
• left — расстояние от левой границы элемента до левой границы области просмотра; myrusakov.ru
• width — ширина элемента; myrusakov.ru
• height — высота элемента; myrusakov.ru
• x — горизонтальная координата левой границы элемента относительно области просмотра; myrusakov.ru
• y — вертикальная координата верхней границы элемента относительно области просмотра. myrusakov.ru

Метод возвращает позицию относительно видимой области экрана, а не всей страницы, поэтому при прокрутке расположение элемента может измениться. sky.pro Для определения абсолютного положения элемента, не зависящего от прокрутки, к результату нужно прибавить значение прокрутки окна. sky.pro