`
jsczxy2
  • 浏览: 1255438 次
  • 性别: Icon_minigender_1
  • 来自: 常州
文章分类
社区版块
存档分类
最新评论

流体(瀑布流)布局插件:Waterfall

阅读更多

Waterfall是jQuery流体布局插件

当前版本: 1.0.6

更新时间: 2012.2.11

使用方法

加载jQuery库 (需1.4+)

加载jQuery.waterfull.min.js , 必须在jQuery库之后;

调用接口: $node.waterfall({/* 此处为设置选项, 可留空 */})

如: $('#container').waterfall({})

设置选项

{
    itemSelector:'.post-home',     //子元素id/class, 可留空
    columnCount:4,                 // 列数,  纯数字, 可留空
    columnWidth:300,               // 列宽度, 纯数字, 可留空
    isResizable:false,             // 自适应浏览器宽度, 默认false
    isAnimated:false,              // 元素动画, 默认false
    Duration:500,                  // 动画时间
    Easing:'swing',                // 动画效果, 配合 jQuery Easing Plugin 使用
    endFn:function(){},            // 回调函数
}

Ajax

$.ajax({
   type: "POST",
   url: "some.php",
   success: function(data){
     $("#container").append(data).waterfall({});
   }
});

github地址https://github.com/iMuFeng/Waterfall

使用网站:http://www.boxui.com

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics