瀑布流

function waterfall(parent,pin){
var oParent=document.getElementById(parent);// 父级对象
var aPin=oParent.getElementsByTagName("li");// 获取存储块框li的数组aPin
var iPinW=aPin[0].offsetWidth;// 一个块框pin的宽
var num=Math.floor(document.documentElement.clientWidth/iPinW);//每行中能容纳的li个数【窗口宽度除以一个块框宽度】
oParent.style.cssText=''+(iPinW*2+1)+'px;margin:0 auto;';//设置父级居中样式：定宽+自动水平外边距

var pinHArr=[];//用于存储 每列中的所有块框相加的高度。
for(var i=0;i<aPin.length;i++){//遍历数组aPin的每个块框元素
var pinH=aPin[i].offsetHeight;
if(i<num){
pinHArr[i]=pinH; //第一行中的num个块框li 先添加进数组pinHArr
}else{
var minH=Math.min.apply(null,pinHArr);//数组pinHArr中的最小值minH
var minHIndex=getminHIndex(pinHArr,minH);
aPin[i].style.position='absolute';//设置绝对位移
aPin[i].style.top=minH+'px';
aPin[i].style.left=aPin[minHIndex].offsetLeft+'px';
//数组 最小高元素的高 + 添加上的aPin[i]块框高
pinHArr[minHIndex]+=aPin[i].offsetHeight;//更新添加了块框后的列高
}
}
oParent.style.height = (Math.max.apply(null,pinHArr))+"px";//设置瀑布流容器高度
// lazyLiong(6,pageNum);
}