Document.body.scrollTop Firefox возвращает 0: ТОЛЬКО JS

Любые альтернативы в чистом javascript?

Следующие операции выполняются в опере, хроме и сафари. Еще не тестировали в проводнике:

http://monkey-me.herokuapp.com

https://github.com/coolcatDev/monkey-me-heroku/blob/master/static/js/myscripts.js

При загрузке страницы необходимо прокрутить вниз до div..content ':

var destiny = document.getElementsByClassName('content');
var destinyY = destiny[0].offsetTop;
scrollTo(document.body, destinyY, 200);

function scrollTo(element, to, duration) {
    if (duration <= 0) return;
    var difference = to - element.scrollTop;
    var perTick = difference / duration * 2;

    setTimeout(function() {
        element.scrollTop = element.scrollTop + perTick;
        scrollTo(element, to, duration - 2);
    }, 10);
};

ОТВЕТЫ

Ответ 1

Попробуйте использовать это: document.documentElement.scrollTop. Если я прав, document.body.scrollTop устарел.

Обновление

Похоже, что Chrome не играет вместе с ответом, чтобы быть в безопасности, как предложил @Nikolai Mavrenkov в комментариях:

window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0

Теперь все браузеры должны быть закрыты.

Ответ 2

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

var bodyScrollTop = document.documentElement.scrollTop || document.body.scrollTop;

Обе части возвращают ноль по умолчанию, поэтому, когда ваш свиток находится в нулевом положении, он будет возвращать нуль, как ожидалось.

bodyScrollTop = 0 || 0 = 0

На странице прокрутки одна из этих частей вернет ноль, а другая вернет некоторое число, большее нуля. Значение Zeroed оценивается как false, а затем логическое ИЛИ || будет принимать другое значение в качестве результата (например, ваш ожидаемый scrollTop 300).

Firefox-подобные браузеры будут видеть это выражение как

bodyScrollTop = 300 || 0 = 300

и остальные браузеры видят

bodyScrollTop = 0 || 300 = 300

который снова дает тот же и правильный результат.

Фактически, все о something || nothing = something:)

Ответ 3

Стандарт document.documentElement, и это используется FF и IE.

WebKit использует document.body и не может использовать стандарт из-за жалоб на обратную совместимость, если они изменились на стандарт, этот пост объясняет это красиво

https://miketaylr.com/posts/2014/11/document-body-scrolltop.html

В документе есть новое свойство, которое WebKit теперь поддерживает

https://developer.mozilla.org/en/docs/Web/API/document/scrollingElement

поэтому это приведет вас к правильному элементу

var scrollingElement = document.scrollingElement || document.documentElement;
scrollingElement.scrollTop = 100;

а также polyfill

https://github.com/mathiasbynens/document.scrollingElement