javascript - window.pageYOffset 返回不准确的值

Question

我需要能够检测元素的边界何时在视口(viewport)中 - 非常简单。为此，我使用了 jQuery 的 scroll 事件。设置基本测试后，我注意到 window.scrollY 和 window.pageYOffset 返回的值不准确。

每个 div 的高度是 1000px，但是我的 window.scrollY 和 window.pageYOffset 返回 756 ?

有什么想法吗？有什么我想念的吗？

(最新版本的 Chrome 和 Firefox 似乎就是这种情况)

Answer 1

除非您需要支持 IE7 或其他东西，否则您不应该使用这些元素来确定视口(viewport)中是否有东西。像这样的东西要好得多:

function isInWindow(el){
    var rect = el.getBoundingClientRect(),
        $window = $(window);

    return (
        (rect.top >= 0) && 
        (rect.left >= 0) && 
        (rect.right <= $window.width()) && 
        (rect.bottom <= $window.height())
    );
}

isInWindow($element.get(0));

// or for multiple

$element.each(function(){
    isInWindow(this);
});

我知道您可能仍然对为什么这些值不同感到好奇，但这应该可以帮助您实现是否在浏览器窗口中的目标。