瀑布流布局分析
布局： 我们使用ul作为整个瀑布流效果的包裹元素，以便以他定位我们需要操作的元素。 每一个li作为一个小的单元，主体展示图片附加一些辅助样式。
我们给图片定义一个宽度，则每一个li单元都有了一个相应的宽度。根据这个宽度，再获取屏幕视窗的宽度，二者相除可以得到每一行需要显示的单元的个数，即列数
第一行横向排列li单元，并使用一个数组记录每列元素的总高度。从第二行开始，将接下来需要显示的元素依次加到总高度最小的那一列，这里我们使用绝对定位实现，通过没列的宽度，需显示的元素所在的列数，以及当前列的总高度，即可对接下来需要显示的元素进行定位。
边缘检测： 我们将最后一个单元li的offsetTop和其offsetHeight的1/2相加，得到当前显示的元素距离“最上端”的高度 然后获取滚动高度scrllTop，以及视窗的高度，将二者进行相加，得到当前视窗距离“最上端”的高度 再将以上得到的两个高度进行比较，如果前者小于后者，则我们认为当前视窗中的元素已经不够显示，或者说内容已经到了视窗边缘，需要向页面中加入更多li单元。
主体逻辑 监听页面的滚动事件，进行边缘检测，检测到进入视窗边缘时，append元素，然后再将页面元素进行重新布局，即可实现瀑布流效果！
源码地址演示地址