前言

like a mountain that is in our path,wo cannot complain that it is there,we simply have to climb it

起由

最近,在搭建个人博客时,其中的Demo展示页面想用瀑布流形式展现,发现现有的js插件大多基于JQ的,而我稍微有点小强迫,不想基于JQ,于是就着手自己封装了一个。顺带就研究了下css3方式实现瀑布流,于是总结了下,写了几个示例demo,就有了本文。

几种常用的瀑布流介绍

一般瀑布流的实现常见有三种方式

  • 传统的多列浮动
  • css3样式定义
  • js计算绝对布局

传统的多列浮动简介

首先固定屏幕中展示的列数,每一列中间的数据作为一组单独计算,插入数据时分别插入不同列中
优点:

  • 布局最为简单,一般只依赖与一个浮动布局
  • 不需要知道内容的高度,所以当有图片未加载时也不影

    网友评论