强大的图片浏览

[javascript]代码库

<ul id="jq22">
	<li><img data-original="img/tibet-1.jpg" src="img/thumbnails/tibet-1.jpg" alt="图片1"></li>
	<li><img data-original="img/tibet-2.jpg" src="img/thumbnails/tibet-2.jpg" alt="图片2"></li>
	<li><img data-original="img/tibet-3.jpg" src="img/thumbnails/tibet-3.jpg" alt="图片3"></li>
	<li><img data-original="img/tibet-4.jpg" src="img/thumbnails/tibet-4.jpg" alt="图片4"></li>
	<li><img data-original="img/tibet-5.jpg" src="img/thumbnails/tibet-5.jpg" alt="图片5"></li>
	<li><img data-original="img/tibet-6.jpg" src="img/thumbnails/tibet-6.jpg" alt="图片6"></li>
</ul>

<script src="js/viewer.min.js"></script>
<script>
var viewer = new Viewer(document.getElementById('jq22'), {
	url: 'data-original'
});
</script>
将js引入即可data-original为原图的缩略图也可不写
<img   title="${image.title}" src="${ctx}/sys/fileInfo/browse?id=${image.fileId}" style="width:132px;height:94px; " alt=""/>
或者直接写一个style规定大小

[代码运行效果截图]

[源代码打包下载]