$ (window) .scrollTop () против $ (document) .scrollTop ()

184

Какая разница между:

$(window).scrollTop()

и

$(document).scrollTop()

Спасибо.

— Frenchie
источник

2

'html' или 'body' для установщика (зависит от браузера) ... 'window' для получателя ... cf Fiddle: jsfiddle.net/molokoloco/uCrLa

— molokoloco

149

Они оба будут иметь одинаковый эффект .

Однако, как указано в комментариях: $(window).scrollTop()поддерживается больше веб-браузеров, чем $('html').scrollTop().

— Бодман
источник

3

он возвращает 0 в IE8 (хотя моя страница находится в режиме причуд, что может сыграть определенную роль)

— Грег Огл

38

$ ('html'). scrollTop () не является кросс-браузерным (как установщик, он не работает, по крайней мере, в Chrome). Наиболее кроссбраузерный способ сделать это на данный момент: $ (window) .scrollTop () как метод получения, $ ('html, body'). ScrollTop (offset) как метод установки.

— Георгий Иванкин

6

Согласно этой ссылке , без аргументов scrollTopникуда не прокручивается, а просто возвращает текущее местоположение прокрутки.

— ИЛИ Mapper

3

@ d2burke scrollTop()- геттер и scrollTop(value)сеттер. scrollTop()без аргументов не меняет позицию прокрутки.

1

@ M98 window.scrollTo (x, y)

— Бодман

36

Во-первых, вам нужно понять разницу между windowи document. windowОбъект является объектом на стороне клиента верхнего уровня. Над windowобъектом ничего нет . JavaScript - это объектно-ориентированный язык. Вы начинаете с объекта и применяете методы к его свойствам или свойствам его групп объектов. Например, documentобъект является объектом windowобъекта. Чтобы изменить document«S цвета фона, вы установите document» s bgcolorсобственности.

window.document.bgcolor = "red"

Чтобы ответить на ваш вопрос, нет разницы в конечном результате между windowи document scrollTop. Оба будут давать одинаковый результат.

Проверьте рабочий пример на http://jsfiddle.net/7VRvj/6/

В целом использование в documentосновном для регистрации событий и использовать , windowчтобы сделать такие вещи , как scroll, scrollTop, и resize.

— Хусейн
источник

Нет разницы в конечном результате. Оба будут давать одинаковый результат.

— Хусейн

Очевидно, что некоторые браузеры не поддерживают прокрутку окна, поскольку объект окна может не быть объектом, который переполняется.

— Бодман

11

Какой браузер не поддерживает окно, будьте конкретны. Вот пример jsfiddle.net/7VRvj/4 . Проверьте это во всех браузерах и дайте мне знать, в каком браузере он не работает.

— Хусейн

4

Кросс-браузерный способ сделать это

var top = ($(window).scrollTop() || $("body").scrollTop());

— амахри тамуноеми
источник

1

Примечание: $("body").scrollTop()всегда возвращайте 0 в Google Chrome.

— Джонатан Родитель Левеск

2

$("body").scrollTop()устарела, больше не работает на Chrome или FF . Вернется 0

— Хорхе Лазо

0

У меня только что были похожие проблемы, scrollTopописанные здесь.

В конце концов я обошел это на Firefox и IE с помощью селектора$('*').scrollTop(0);

Не идеально, если у вас есть элементы, на которые вы не хотите воздействовать, но это позволяет избежать неравенства Document, Body, HTML и Window. Если это поможет ...

— Tapiochre
источник

20

Вы никогда не должны использовать * этот способ (на самом деле, избегать * вообще). Вместо нацеливания на один элемент, вы воздействуете на весь DOM. Огромный удар по производительности. Селекторы должны быть максимально точными.

— Влад

2

Я лично всегда использовал $("html,body").scrollTop(val)- никогда не было никаких проблем

— Рой