Як знайти абсолютне положення елемента за допомогою jQuery?

398

Чи є спосіб знайти абсолютне положення елемента, тобто відносно початку вікна, використовуючи jQuery?

javascript jquery

Відповіді:

650

.offset() поверне зміщене положення елемента як простого об'єкта, наприклад:

var position = $(element).offset(); // position = { left: 42, top: 567 }

Ви можете використовувати це повернене значення для розташування інших елементів на одному місці:

$(anotherElement).css(position)

— Півмісяць свіжий
джерело

Я завжди забуваю цю, і знову знаходжу вашу публікацію, коли я гугл: p

— Aren

Здається, це не завжди повертає абсолютну позицію через різницю меж і т. Д.

— Том

Я використовую хром і offset()не повертає належну верхню координату. Натомість він повертає приблизно на 300 пікселів більше верхньої координати елемента в документі. Чому ??

— SoLoGHoST

chrome, FF та IE дають різні результати :(

— Rizwan Mumtaz

@Aren Я завжди забуваю це, і щоразу вважаю твій коментар кумедним :)

— Alex

197

Зверніть увагу, що $(element).offset()повідомляє про розташування елемента щодо документа . Це чудово працює в більшості обставин, але у випадку з position:fixedвами можна отримати несподівані результати.

Якщо документ більше , ніж видова і ви прокручувати по вертикалі по напрямку до нижньої частини документа, то вашому position:fixedелемент offset()значення буде більше очікуваним значення на суму , яку ви прокручувати.

Якщо ви шукаєте значення відносно вікна перегляду (вікна), а не документа на позиції: фіксований елемент, ви можете відняти значення документа зі scrollTop()значення фіксованого елемента offset().top. Приклад:$("#el").offset().top - $(document).scrollTop()

Якщо position:fixedбатьківським зсувом елемента є документ , parseInt($.css('top'))замість цього потрібно прочитати .

— Том Ожер
джерело

Я шукав саме це! Для нооба, як я: значення, яке слід відняти,$(document).scrollTop()

— доктор Джанлуїджі Зейн Занеттіні

Дивовижно! Це має бути головна відповідь!

— Шиваншу Гоял