检测是否可以在页面上滚动

Question

我有一个函数，当查看器滚动到容器末端附近的位置时，会向容器添加更多内容。它完美地运作：

var elem = $('#cont');
var bo = $('body');
$(window).scroll(function(){
    if (elem.outerHeight() - bo.scrollTop() - 350 <= 0) {
        for(var i = 0; i < 3; i++){
            elem.append('<div class="box"></div>');
            $('.box').each(function(){
                $(this).fadeIn('slow');
            });
        };
    };
});

问题是，如果最初没有加载足够的内容，那么它就无法加载更多内容！

我需要做什么：

我需要检测身体是否无法滚动。所以我可以添加内容，直到滚动为止。我怎么能这样做？

Jsfiddle

Answer 1

你可以这样做：

while($(document).height() <= $(window).height()){
    $('#cont').append($('<div/>', {class : 'box', style : 'display : block'}))
}

$('.box').hide().fadeIn('slow');

小提琴：http://jsfiddle.net/FYtZX/1/

Answer 2

您可以使用此功能来检测某些内容是否可滚动。 https://github.com/s-a/jQuery.readMore/blob/master/jquery.readmore.js#L6