类似百度图片搜索展示-响应式画廊Gallery插件Justified Gallery
我们在百度搜索图片的时候，会发现百度展现出来的图片结果都是有大有小，但是整体的排版并不会因为有大有小而使得整个页面变得参次不齐，反而排版的还是挺整齐的，那么这种图片展示方式要怎么实现呢？这里就碰巧发现了这么个JQ插件，能够快速简单的做出这样的效果。
Justified Gallery这个jQuery插件允许你在一个合理的空间内创建响应式、无限滚动、高品质的画廊，并填充满所有的空间。
对于制作网站的人来说，一个常见的问题就是使用各种尺寸和宽高比的图像来创建一个优雅的画廊，Flickr 和 Google+对于这方面的处理非常的棒，这个插件的目的就是使用一种新的快速的算法来帮你解决这个问题。
插件主要特性
无需在意像素：使用一种先进的算法无需剪裁图像进行自动调整
无限滚动：已经为图片无限加载做好准备，只需添加图片并告诉Justified Gallery
高质量：支持任何设备和屏幕尺寸
动态画廊：过滤、排序、随机、添加、删除图像，你可以对画廊进行任何操作
灯箱效果一体化：你可以使用现有的灯箱效果，如Colorbox 或 Swipebox
高度可定制化：提供很多选择供你打造你想要的画廊效果
Captions：可以给你的图片添加说明文字
响应式：可根据屏幕尺寸自动调整大小
快速设计：带有智能的缩略图加载，生而很快
错误处理：管理服务器的错误，自动跳过不可用图像，并在控制台给出提示
如何使用
Justified Gallery接受固定格式的画廊：每一个a链接中包含一个缩略图，而链接指向原始图片：
<div id="mygallery" >
<a href="path/to/myimage1_original.jpg">
<img alt="Title 1" src="path/to/myimage1_thumbnail.jpg"/>
</a>
<a href="path/to/myimage2_original.jpg">
<img alt="Title 2" src="path/to/myimage2_thumbnail.jpg"/>
</a>
<!-- other images... -->
</div>
当然，它也接受 其他格式 ，适应你不同的需求。
插件需要jQuery支持，之后还需引入插件的文件：
<link rel="stylesheet" href="css/justifiedGallery.css" />
<script src="js/jquery.js"></script>
<script src="js/jquery.justifiedGallery.js"></script>
现在你只需调用即可，它会使用默认参数调整你的图像：
$("#mygallery").justifiedGallery();
更多使用请参考其 使用文档 。
项目 Github 地址： https://github.com/miromannino/Justified-Gallery
来自： http://9iphp.com/web/javascript/jquery-plugin-justified-gallery.html
这里放了我已经整理好的压缩包，大家可以下载尽快投入使用了。压缩包已经去掉无关的css和js，尽可能简单的展示了如何应用。
