美文网首页
关于瀑布流布局

关于瀑布流布局

作者: JunVincetHuo | 来源:发表于2017-01-17 15:36 被阅读0次

    原理

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

    demo

    task-30

    相关文章

      网友评论

          本文标题:关于瀑布流布局

          本文链接:https://www.haomeiwen.com/subject/xuimbttx.html