对于瀑布流下拉加载 可采用 masonry+infinitescroll 插件方法 或者 BlocksIt 等多种插件方法

但因项目需要，瀑布流和下拉配合，所以采用了上手时间较短的 masonry+jQuery库方法，细节会在注释中注明

效果图：

步骤一：瀑布流采取jquery插件 masonry 用法 （自适应屏幕宽度）

 //由$(function(){})自动加载调用即可，无须事件触发
   var $container = $('.sucais');
    $container.imagesLoaded(function() {
        $container.masonry({
                itemSelector: '.sucai',
                gutter: 20,                     //定义了内容块之间的距离
                // isAnimated: true,            //打开动画选项
               // columnWidth: 5                //每两列之间的间隙为5像素
            });
      });

配套HTMLdemo如下  特注明外层div 和内层div 不要设置固定死高度 若设置 无法完成瀑布流样式

<div class="sucais">    
    <div class="sucai">1111111111</div> 
    <div class="sucai">2222222222</div>    
    <div class="sucai">3333333333</div> 
    <div class="sucai">4444444444</div> 
 </div>

附 masonry插件 内部script引用即可：jquery.masonry.min.rar

步骤二：下拉加载采取主流的判断下拉条距离底部位置来做判断

$(document).ready(function(){  
            var range = 0;//距下边界长度/单位px   
            var totalheight = 0;
            var main = $("#mscreen"); //主体元素
            $(window).scroll(function(){  
                var srollPos = $(window).scrollTop();    //滚动条距顶部距离(页面超出窗口的高度)    
                //console.log("滚动条到顶部的垂直高度: "+$(document).scrollTop());  
                //console.log("页面的文档高度 ："+$(document).height());  
                //console.log('浏览器的高度：'+$(window).height());        
                totalheight = parseFloat($(window).height()) + parseFloat(srollPos); 
                if(($(document).height()-range) <= totalheight) {
 
                    $.get("xxx.php",{            //ajax异步调用区
                        ajaxType:'kNewsList',
                        offsize:offsize,
                        },
                        function(data){
                            //alert(data);                
                            if(data==0){
                                $('#loading').html("已为您加载全部");
                            }else{
                                $('.sucai:last').after(data);        
                                 $('.sucais').masonry('reload');    //参数追加完 重新加载masonry瀑布流方法，实现全局效果
                            }
                            });
                }
            });  
        });