【iGeek手册】 如何使用bricks.js创建一个像素级别的高性能瀑布流页面特效？

传统的插件类的瀑布流不能很好的解决页面性能问题，加载过程非常冗余， 特别是如果你使用过类似jQuery masonry等插件的话，相信你明白我的意思，嘿嘿， 而且对于元素的像素级别的控制效果也不是很到位 ， 而且往往依赖一些第三方类库，比如 jQuery

 

在今天这篇文章中， 姥爷我介绍一下一个不错的JS类库 - bricks.js , 下面是一些它的优势：

• 不需要HTML标签或者CSS样式
• 简化并且强大可阅读的代码配置
• 可选的尺寸变化功能操作
• 优化的添加元素操作

 

这个插件是开源的， 你可以方便的在Github上下载并且使用， 性能非常强悍， 生成数千个元素的布局，只需要毫秒级别， 大家可以点击这里查看demo：

http://callmecavs.com/bricks.js/

 

脚本使用非常简单， 只需要传入三个参数：

1. Container ：一个DOM容器元素用来容纳元素
2. Packed ： 一个定义元素如何排列的属性
3. Sizes ：一个像素级别滴设置宽度和元素间距的数组

 

更多的配置信息，请参考一下相关文档，如下：

https://github.com/callmecavs/bricks.js

 

---

 

如果大家有更多好的建议和用法，请给我留言 ^_^