jQuery瀑布流插件 Masonry.js

1、这样参差不齐的多栏布局，叫“方砖石布局”，和“瀑布流布局”，很多网站都有使用这样的布局，比如：淘宝的哇哦、花瓣网、蘑菇街

3、分别下载 jQuery 与 Masonry 下载之后的脚本文件嵌入到你想使用瀑布流形式的页面中，注意文件的名称与路径，根据你自己的实际情况修改。

5、样式代码#masonry {padding:20px;}.item{margin-bottom:20px;float:left;width:220px;}.itemimg{max-width:100%}针对第二步的页面代码，我们需要添加一点样式，.item 类我们添加了浮动属性，还设置了他的宽度

6、4，在页面中启用瀑布流形式的脚本代码<script>$('#masonry').imagesLoaded(function() {$('#masonry').masonry({itemSelector: '.item'});});</script>

7、需要注意的是，如果你需要加载图片，Masonry不会在图片加载完后重新布局，这可能会影响你的布局效果，建议配合使用imagesloaded插件。