关于瀑布流布局

2017-01-17  本文已影响0人  JunVincetHuo

原理

  1. 瀑布流布局原理是什么?
  1. 计算出浏览器可以放置元素的个数:浏览器宽度/元素宽度。如果元素之间有间隙(margin),则要使用outerWidth(true);。要放置的元素需要使用绝对定位position: absolute;。
  2. 定义一个用于存放元素高度和的数组,每次找到数组中的最小高度,然后把新的元素放在这个最小高度对应的元素下方。然后根据元素下标计算出top和left值。然后使用jQuery的css()来放置元素。
  3. 遍历元素,放置元素。

demo

task-30

上一篇下一篇

猜你喜欢

热点阅读