IE8 альтернатива window.scrollY?

Я пытаюсь определить, сколько пикселей я прокрутил, используя window.scrollY. Но это не поддерживается в IE8. Что такое безопасная альтернатива кросс-браузера?

Ответ 1

Совместимая с браузером версия для window.scrollY - document.documentElement.scrollTop. Подробнее о подробном обходном пути в IE8 и ранее см. Раздел "Примечания" этого фрагмента документации Mozilla.

Как уже упоминалось здесь, еще одна альтернатива window.scrollY(обратите внимание, что это только совместимость с IE9 +).

В отношении ссылки выше, проверьте Пример 4 для полностью совместимого способа получения положения прокрутки (он даже учитывает увеличение по мере того, как упоминается @adeneo!) с помощью document.documentElement.scrollTop и document.documentElement.scrollLeft,

Здесь, попробуйте пример для себя!

Ответ 2

Если вам не нужно многому использовать, просто выполните:

var scroll = 
    window.scrollY //Modern Way (Chrome, Firefox)
 || window.pageYOffset (Modern IE, including IE11
 || document.documentElement.scrollTop (Old IE, 6,7,8)

Ответ 3

Если вы используете jQuery, я использовал $(window).scrollTop(), чтобы получить позицию Y в IE 8. Казалось, что это работает.

Ответ 4

Если у вас есть веская причина не просто использовать библиотеку для обработки такой базовой функциональности, не стесняйтесь "не изобретать колесо".

Mootools является открытым исходным кодом, и вы можете просто "украсть" его реализацию, соответствующие фрагменты:

getScroll: function(){
    var win = this.getWindow(), doc = getCompatElement(this);
    return {x: win.pageXOffset || doc.scrollLeft, y: win.pageYOffset || doc.scrollTop};
}

function getCompatElement(element){
    var doc = element.getDocument();
    return (!doc.compatMode || doc.compatMode == 'CSS1Compat') ? doc.html : doc.body;
}

Эти 2 являются основой для определения того, какой режим совместимости у вашего текущего браузера есть, а затем использовать window.pageYOffset или document.body.scrollTop на основе этого или даже document.html.scrollTop для действительно старых багги-браузеров.

Ответ 5

Основываясь на ответе Нильса, я придумываю немного более компактное решение, когда нужна только координата Y:

function get_scroll_y() {
    return window.pageYOffset || document.body.scrollTop || document.html.scrollTop;
}

Ответ 6

На основе Mozilla и ответов выше, у меня есть функции ниже, чтобы легче получить координаты:

var windowEl = (function () {
    var isCSS1Compat = ((document.compatMode || "") === "CSS1Compat");
    function scroll() {
        return { left: scrollLeft, top: scrollTop };
    };
    function scrollLeft() {
        return window.scrollX || window.pageXOffset || (isCSS1Compat ? document.documentElement.scrollLeft : document.body.scrollLeft);
    };
    function scrollTop() {
        return window.scrollY || window.pageYOffset || (isCSS1Compat ? document.documentElement.scrollTop : document.body.scrollTop);
    };
    return {
        scroll: scroll,
        scrollLeft: scrollLeft,
        scrollTop: scrollTop
    }
})();

Согласно документации Mozilla, как указано в приведенных выше сроках жизни, свойство The pageXOffset является псевдонимом для свойства scrollX, так что, строго говоря, не нужно.

Anyhoo, использование:

var scroll = windowEl.scroll();
// use scroll.left for the left scroll offset
// use scroll.top for the top scroll offset

var scrollLeft = windowEl.scrollLeft();
// the left scroll offset

var scrollTop = windowEl.scrollTop();
// the top scroll offset

Протестировано и работает в Chrome, Firefox, Opera, Edge (8-Edge), IE (7-11), IE8 на XP

Ответ 7

В angular мы используем:

  var windowEl = angular.element($window);
  scrolldist = windowEl.scrollTop();