将砌体添加到我的无限滚动方法中

时间:2013-01-05 20:51:51

标签: jquery jquery-masonry infinite-scroll

我有自定义的无限滚动脚本,它使用ajax调用:

    $(function(){

    var fetching = false;
    var $container = $('#content_home');

    $container.imagesLoaded(function(){
        $container.masonry({
            itemSelector : '.wrdLatest',
            columnWidth:15
        });
    });


    $(window).scroll(function(){
        var bufferzone = $(window).scrollTop() * 0.20;
        if (!fetching && ($(window).scrollTop() + bufferzone > ($(document).height()- $(window).height()-1) && $(".wrdLatest:last").attr("id") != 1)){

        $('.loading').fadeIn(250);
        lastPostFunc();

        }       
    }); 

    function lastPostFunc() 
    { 
        fetching = true;
        $.post("/ajax/loadmore.php?lastid="+$(".wrdLatest:last").attr("id"),

        function(data){
            if (data != "") {
                $container.masonry( 'appended', data, true );
                //setTimeout(function(){$(".wrdLatest:last").after(data);},1000);
                setTimeout(function(){fetching = false;},2000);
                $('.loading').delay(1000).fadeOut(250);
            }
        });
    };  

});

我也实施了砌体脚本。现在我想通过使用砌体调用将新内容(在滚动后加载)附加到网页上:

 function(data){
        if (data != "") {
            $container.masonry( 'appended', data, true );
            //setTimeout(function(){$(".wrdLatest:last").after(data);},1000);
            setTimeout(function(){fetching = false;},2000);
            $('.loading').delay(1000).fadeOut(250);
        }
    });

但是部分:

 $container.masonry( 'appended', data, true );

似乎不起作用。在我实施砌体之前,我使用了自己的方法:

 //setTimeout(function(){$(".wrdLatest:last").after(data);},1000);

这很有效。

我在砌筑电话中做错了什么?

演示:http://acc.itemmized.com

似乎数据被“超过”旧内容加载......并且它不是在砖石布局中......

0 个答案:

没有答案