Masonry jQuery布局插件使用方法

Masonry是一款很好用的jquery网页布局插件,它可以去掉不同高度div之间的空白,

让你的网页看上去更加的整齐、漂亮!

一下是官网的实例截图:

从这2张图片中就能看到此插件的作用了把!
该如何使用呢,其实很简单,看下代码:

test1
test2
test3
test4


看到了,真的很简单,只要使用jquery语句,调用一下就OK了,
插件的功能还不仅如此,想看到更多的效果,请去作者博客!

附插件下载地址以及详解地址:

作者详解:http://desandro.com/demo/masonry/docs/
下载地址:http://desandro.com/resources/jquery-masonry/

未经允许不得转载:WEIXING.ME » Masonry jQuery布局插件使用方法

相关文章

评论 (0)

  1. avatar

    那哪是图片呀!!!

  2. avatar
    太子虹04-14 13:24回复

    技术还是技术的,顶顶吧

  3. avatar
    apollosaar03-19 17:25回复

    非常不错 ....受教..

  4. avatar
    徐小牛04-22 17:14回复

    我就是用这个插件布局我的首页的,但是遇到一个问题,就是每个div中都有高度不同的图片,每次读取的时候可能由于网速问题图片的长×宽信息不能及时读取到,导致上面一排的div被下面一排的覆盖住,要么在生成网页的时候定义图片长×宽,要么只要把每个div限定一个固定高度,不然没法解决,请问站长这个该怎么办呢,我在http://bbs.blueidea.com/thread-3058287-1-1.html发了帖子,但是没人解答

    • avatar
      WEIXING04-23 0:25回复

      我也遇到过,我记得我的解决方法好像是把js放在最上面,让js先运行。这个插件我是在视觉中国(http://down.chinavisual.com)中看到的,自己也模仿过那个网站,所以才有的这篇文章。你可以先试试我说的方法,如果还是不行你就去视觉中国看看,分析一下他的源文件,看看他们是怎么实现的!

  5. avatar
    徐小牛04-23 7:15回复

    谢谢,我去看看