原理:
1.瀑布流里的元素宽度都相同,用窗口宽度除以一个元素的宽度得到每行能容纳的列数。
2.创建一个空数组,用来储存每列中所有元素相加的高度。
3.先把第一行的元素的高度存储进数组。利用遍历的方法得到第一行高度最小的元素以及这个元素在数组中的索引数(index)。
4.对下一个元素使用绝对定位,将其放在上一步选中的高度最小元素的下面(top值为上一步选中元素的高度,left值为选中元素距离窗口的宽度)。
5.当元素绝对定位完成之后,将其高度和原来数组中最小的高度相加,利用之前得到的索引号更新数组。
6.这样在不断的遍历数组中,完成了所有元素的定位,达到了瀑布流的效果。
代码
本文版权归本人和饥人谷所有,转载请注明来源。