jQuery 瀑布流

瀑布流的实现原理

• 要想实现瀑布流首先需要确定需要排列的内容，宽度需要一致；
• 设定父容器相对定位，需排列子元素绝对定位；
• 通过计算容器的宽度（一般为窗口宽度）与元素的宽度，两者相除取整，得到每行防止的元素个数
• 创建数组，遍历每列的元素高度，将下一个元素放于没列高度最低的元素下方，这样就能成为瀑布流的布局
• 封装过程还需考虑适配，绑定resize事件，这样屏幕宽度进行变化，同样适用。

demo