Question

我希望在用户向下滚动内容时加载所有<div class='display' id='maskolis'>内容（不止一个）

这是我工作的javascript： -

function isScrolledIntoView(elem) {
    var docViewTop = $(window).scrollTop();
    var docViewBottom = docViewTop + $(window).height();
    var elemTop = $(elem).offset().top;
    var elemBottom = elemTop + $(elem).height();
    return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
}

$(document).ready(function () {
    $(document).on('scroll', function () {
        $('.display').each(function () {
            if (isScrolledIntoView($(this))) {
                $(this).removeClass('display').fadeIn();
            }
        });
    });
});

对于整个脚本，请转到http://goo.gl/FYQ2ga

我尝试删除包含css display的滚动条中的课程display:none。

但是我想让内容实际只在滚动上加载，以便加载顺畅。

Answer 1

好的，所以不要制作

$(this).removeClass('display').fadeIn();

您应该加载内容，执行类似

的操作

$self = $(this);
$self.load(url, function(){
    $self.removeClass('display').fadeIn();
});

如何在向下滚动时加载div元素

1 个答案: