瀑布流布局

1. 瀑布流布局的原理是什么？

• 定元素宽，容器宽，计算出容器一排能够容纳的元素列数；
• 得到一排元素的高度数组，取其中的最小高度；
• 图片依次排列，按照上一排元素的高度从小到大放置其下方；
• 通过css的position属性，结合jQuery实现排列；
• 监听resize事件，满足响应式。

2. demo：

瀑布流布局雏形

---

本文归饥人谷和本人所有，如需转载请注明来源，谢谢