日期:2014-05-16 浏览次数:20369 次
<script>
$(function(){waterfall(".cell")});
function waterfall(cls){
if(!$(cls).length) return;//没有元素
var con={
obj:null,//图片div对象
l:0, //总共数量
w:214,//列宽
s:10,//列间距
list:0, //多少列
h:1, //外div的高
arr:[],//最后一排数组
state:"loading" //状态 loading:加载图片中,ajax:正在发生ajax请求,finish:完成任务,load_resize:加裁过程中窗口变化(记录起来,加载完后处理),resize:执行了窗口变化,reset:窗口变化排序中再次重排
};
con.obj=$(cls);//图片div对象
con.l=con.obj.size();//统计共有多少个图片div
con.list=Math.floor($("#container").width()/(con.w+con.s));//统计共有多少列
fall_pic(0);
$(window).resize(function(){
var w=Math.floor($("#container").width()/(con.w+con.s));//重新统计共有多少列
if(w!=con.list){
//窗口变化造成列数发生了变化
if("loading|load_resize|ajax".indexOf(con.state)!=-1){
//如果正在加载中,需要加载完后再执行重排
con.state="load_resize";
}else{
//已经排完或者执行重排过程
con.list=w;
con.h=1;
if("finish"==con.state){
con.state="resize";//执行重排