pageYOffset IE8中的滚动和动画 [英] pageYOffset Scrolling and Animation in IE8

问题描述

我正在进行滚动页面设计，我有以下Javascript来隐藏并显示一个对话框：

I am working on a scrolling page design and I have the following Javascript to hide and show a dialog box:

        if(window.pageYOffset >= 300){

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

    }

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

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

    }

这适用于Chrome，FF，IE9 +

This works great in Chrome,FF, IE9+

然而，在IE8,7中它只是有用的。它正确显示和隐藏元素，但是在评估滚动位置和隐藏元素之间的延迟是可怕的。此外，没有褪色，只是发生了。

However, in IE8,7 it only kind of works. It shows and hides the element properly but the delay between when it evaluates the scroll position and when it hides the element is horrendous. Also, there is no fade, it just happens.

我想知道它是否只是我需要处理的IE8问题，或者是否有办法让我用IE8实现被动，干净的淡入淡出。

I am wondering if its just a problem with IE8 that I need to deal with or if there is a way for me to achieve a reactive, clean fade with IE8.

推荐答案

pageYOffset 和 pageXOffset ，请尝试此函数：

// 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 
    }; 
}

这篇关于pageYOffset IE8中的滚动和动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！