无限加载滚动jQuery瀑布流布局插件

版权所有,禁止匿名转载;禁止商业使用。

无限加载滚动jQuery瀑布流布局插件

实用无限加载滚动jQuery瀑布流布局插件,效果非常不错,兼容性也很好,插件参数可自定义配置,

可配置列宽,列间距,是否渐显载入,渐显速率,挺好用的,推荐下载使用。


参数配置:


//参数
 setting={
  column_width:204,//列宽
  column_className:'waterfall_column',//列的类名
  column_space:10,//列间距
  cell_selector:'.cell',//要排列的砖块的选择器,context为整个外部容器
  img_selector:'img',//要加载的图片的选择器
  auto_imgHeight:true,//是否需要自动计算图片的高度
  fadein:true,//是否渐显载入
  fadein_speed:600,//渐显速率,单位毫秒
  insert_type:1, //单元格插入方式,1为插入最短那列,2为按序轮流插入


  getResource:function(index){ }  //获取动态资源函数,必须返回一个砖块元素集合,传入参数为加载的次数


},

  


调用方法:

1.加载CSS和JS文件,jQuery.js和插件js

2.书写HTML


<div id="container">
    <div class="cell"><img src="images/00.jpg" alt="jQuery瀑布流插件图片加载1"/><p>00</p></div>
  <div class="cell"><img src="images/01.jpg" alt="jQuery瀑布流插件图片加载2"/><p>00</p></div>
 </div>

3.函数调用

$('#container').waterfall(opt);


0 0