原生JS实现美图瀑布流布局赏析

自pinterest网站爆红以来,国内一度掀起“仿PIN”狂潮,诸如花瓣、蘑菇街等等。正是如此,“瀑布流”式布局受到广大网民的青睐。众多知名JS库,也相继出现“瀑布流”布局插件,譬如jQuery的Masonry插件、KISSY的waterfall插件等。今天闲来无聊,我也自己动手弄了段原生JS代码,实现了简单的“瀑布流”布局效果,当然肯定不能和以上那些优秀插件相提并论,有兴趣的朋友,可以去看看,希望能带给你或多或少的收获。

1. js代码:    




  
  Waterfall代码



、瀑布流



































































































、内部瀑布流
-
-
-
-
-
-
-
-
-





























































































































































2. [图片] 瀑布流.jpg   

原生JS实现美图瀑布流布局赏析_第1张图片

你可能感兴趣的:(原生JS实现美图瀑布流布局赏析)