PageYOffset Прокрутка и анимация в IE8

Я работаю над прокруткой дизайна страницы, и у меня есть следующий Javascript, чтобы скрыть и показать диалоговое окно:

        if(window.pageYOffset >= 300){

            $('#m1').fadeIn('slow');

    }

    if(document.documentElement.scrollTop >=300){

        $('#m1').fadeIn('slow');

    }

Это отлично работает в Chrome, FF, IE9 +

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

Мне интересно, просто ли это проблема с IE8, с которой мне нужно иметь дело, или если у меня есть способ достичь реактивного, чистого исчезновения с IE8.

Ответ 1

pageYOffset и pageXOffset не поддерживаются в IE8 и ранее, попробуйте эту функцию:

// Return the current scrollbar offsets as the x and y properties of an object
function getScrollOffsets() {

    // This works for all browsers except IE versions 8 and before
    if ( window.pageXOffset != null ) 
       return {
           x: window.pageXOffset, 
           y: window.pageYOffset
       };

    // For browsers in Standards mode
    var doc = window.document;
    if ( document.compatMode === "CSS1Compat" ) {
        return {
            x: doc.documentElement.scrollLeft, 
            y: doc.documentElement.scrollTop
        };
    }

    // For browsers in Quirks mode
    return { 
        x: doc.body.scrollLeft, 
        y: doc.body.scrollTop 
    }; 
}

Ответ 2

Вы также можете исправить это, используя следующее:

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

Итак, у вас есть

if((document.body.scrollTop || document.documentElement.scrollTop || window.pageYOffset) >= 300){
        $('#m1').fadeIn('slow');
}

Таким образом вы можете избежать репликации кода.