瀑布流

 $(function() {
                  
           //瀑布流           
            GetTodayWall("GetPicWallList");
           
       //点击更多加载
        $("#loadMeinvMOre").click(function() {        
               var tpage = Number($("#hidtotalpage").val());
               var cpage = Number($("#hidcurpage").val());                
                    if(cpage < tpage)
                    {                      
                        GetTodayWall("GetPicWallList",++cpage);                        
                    }
                    if(cpage == tpage){
   
                        $("#loadMeinvMOre").css("display","none");
                    }
                
           });     
             
          
        });

     //瀑布流
       //每次获取最短的ul,将图片放到其后
     function getMinUl() {
        var $arrUl = $("#container .col");
        var $minUl = $arrUl.eq(0);
        $arrUl.each(function(index, elem) {
            if ($(elem).height() < $minUl.height()) {
                $minUl = $(elem);
            }
        });
        return $minUl;
    }
      //从服务器端取回数据
      function GetTodayWall(m,p){
        if(!p) {
          p=1;
         }else{
        _initData = null;
         }
       $minUl = getMinUl();     
       
        var param = {
        ClassName: "Hqew.BLL.Topic.TopicWeidyBLL",
        MethodName: m,
        ParamModelName: "Hqew.Model.Topic.WeidyInfoResult",
        page: { AllowPaging: true, PageSize: 6, PageIndex: p },        
        onRequest: null,
        onResponse: onResponseSucess,
        onComplete: onLoadSucess
    }
    $.ajaxRequest(param);
    }

  
  function onResponseSucess(result)
   {
    for(var i=0;i<result.length;i++)
    {
       var data = 0;
       for (var i = 0; i < result.length; i++) {  
            var picName = result[i]["ImgSrc"].lastIndexOf(".");
                picName_ = result[i]["ImgSrc"].substring(0, picName)+"_Abbr";
            var picNameLast = result[i]["ImgSrc"].substring(picName,result[i]["ImgSrc"].length);
            var pic = picName_ + picNameLast ;
            var zanNum = result[i]["ZanNum"] == null ? 0 : result[i]["ZanNum"] ;  
            var html = "";
            html = '<li><div class="water_pic"><a href="/file/Topic/Weidy/Image/' + result[i]["ImgSrc"] + '" target="_blank"><img class="tip" src = "/file/Topic/Weidy/Image/'
        + pic +'" /></a></div><div class="water_user"><div><p class="ImgDesc">'+result[i]["ImgDesc"]
        +'</p></div></li>';
          $minUl = getMinUl();
          $minUl.append(html);   
     }
    }
    return result;
}

function onLoadSucess(a,b)
{   
    $("#hidcurpage").val(b.PageIndex);
    $("#hidtotalpage").val(b.TotalPage); 
}

 <!-- 瀑布流begin -->
       <div id="container">
    <ul class="col">        
    </ul>
    
    <ul class="col">
    </ul>
    
    <ul class="col" style="margin-right:0">
    </ul>
    
    <a href="javascript:" class="loadMeinvMOre" id="loadMeinvMOre">加载更多</a>    
</div>
 <input id="hidtotalpage" type="hidden" />
 <input id="hidcurpage" type="hidden" />
 
 <!-- 瀑布流end -->