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

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

我试图删除类 display在有 css 的滚动条上 display:none .

但我想让内容实际加载时只滚动，以便加载流畅。

Answer 1

好吧，所以不用做

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

你应该加载内容，做类似的事情

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