3
瀑布流介绍
source link: https://yuguo.us/weblog/waterfall/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
瀑布流介绍
余果 2012-01-08 front-end关于瀑布流
最近几个月突然流行一种布局方式——瀑布流。
比如最早的 Pinterest，然后国内的33号铺，Mark之，蘑菇街，还有Qzone的好友相册，以及淘宝最新上线的“哇哦” 等等，都是采用这种布局方法。
兼容性较强的实现方法有两种，taobaoUED有介绍：
- N列布局方法
- 绝对定位方法
推荐使用绝对定位方法，那么如何使用绝对定位呢？有两个js库值得推荐。
masonry提供的定位参数更多，包括流式布局、居中、图片lazyload、jQuery动画、在瀑布流中定位一个区域（放广告）等。
KISSY更轻便，而且还多了一个专门异步加载的class。
二者各有所长，根据自己的需要选择一个即可，用法也很简单，看看API和demo就可以了。
我写字的地方迁移到公众号啦~欢迎关注我的公众号：余果专栏
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK