插件描述：images-grid是一款仿Facebook图片画廊效果的jQuery插件。该jQuery图片画廊插件默认在图片数量超过5张的情况下，只显示前5张图片。当用户点击图片缩略图时，会以全屏lightbox的方式显示图片，通过前后导航按钮来查看所有的图片。
使用方法
在页面中引入images-grid.css，jquery和images-grid.js文件。
1 2 3 | <link rel="stylesheet" href="src/images-grid.css"><script src="jquery.min.js" type="text/javascript"></script><script src="jquery.ripple.js" type="text/javascript"></script> |
HTML结构
使用一个<div>元素来作为图片画廊的容器。
1 | <div id="gallery"></div> |
初始化插件
在页面DOM元素加载完毕之后，可以通过imagesGrid()方法来初始化该网格图片画廊插件，并动态插入图片。
1 2 3 4 5 6 7 8 9 10 | $('#gallery').imagesGrid({ images: [ 'photos/1.jpg', 'photos/2.jpg', 'photos/3.jpg', 'photos/4.jpg', 'photos/5.jpg', 'photos/6.jpg' ]}); |
配置参数
images-grid网格图片插件的可用配置参数有：
images：类型：数组。图片的URL地址。
aling：类型：布尔值。是否对齐不同尺寸的图片。
getViewAllText：类型：函数。在图片大于5张时显示的文本。
特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com
- 上一个特效： jQuery表格排序筛选插件
- 下一个特效： jQuery可视化HTML编辑器插件xhedit