为什么 $(window).height() 和 $(document).height() 等价在 Firefox 中效果不佳？

Question

我正在使用Tumblr的

API来制作我发布到Tumblr的照片的提要。我的想法是有一个无限滚动功能，可以加载 20 张图像集。

最初的 20 张图像加载正常。这是我用于加载后续图像集的代码：

var o = 0;
$(window).scroll(function () {
    if ($(window).scrollTop() + 1 >= $(document).height() - $(window).height()) {
        o += 20;
        $.ajax({
            url: 'http://api.tumblr.com/v2/blog/howwesabah.tumblr.com/posts?api_key=PtoHvq51kOdQlzU6YclOfGOlTuwfm5Chf1cScFnFNhbHxWMDWH&offset=' + o,
            dataType: 'jsonp',
            success: function (results) {
                console.log(results);
                for (j = 0; j <= 19; j++) {
                    var photourl = results.response.posts[j].photos[0].alt_sizes[3].url;
                    var photolink = results.response.posts[j].short_url;
                    $('#tumblr #container').append('<div class="item"><img src="' + photourl + '"/></div>');
                }
            }
        });
    }
});

这一切都在Chrome/Safari/Opera甚至IE中都没有问题。但是，当我滚动到文档底部时，Firefox似乎不想加载图像。我已经在这里读到，有时Firefox和其他浏览器之间存在1px的差异，但这似乎并不能解决问题。

我知道这是一个特定的问题，因此违反了 Stackoverflow 规范，所以我想我的一般问题（同时记住我自己的问题）是 Firefox 发生了什么以及 $（window）.height（） 和 $（document）.height（） 的等价性？

Answer 1

$(window).height();将返回可见窗口的高度。

$(document).height();将返回整个文档的高度，而不仅仅是可见部分。

工作示例

也就是说，我认为您的具体问题不在于 if 语句......
我测试了它，它似乎在Firefox，Chrome和IE9中同样有效。

工作示例 2

$(window).scroll(function () {
    if ($(window).scrollTop() +1 >= $(document).height() - $(window).height()) {
        $('body').css('background','red');
    }else{
        $('body').css('background','none');
    }
});