jQuery H5移动端图片预览插件fly_zomm_img.js

一款jQuery H5移动端图片预览插件fly_zomm_img.js，点击每张图片的时候，会有一个弹出遮罩层来显示大图效果，可以点击按钮放大、缩小、还原和关闭，适合移动端查看效果，PC端效果请自主适配。

分类：图片代码 > 图片插件难易：初级

查看演示下载资源下载积分： 20 积分

页面的head部分，简单设置页面元素的样式，代码如下：

<style type="text/css">
    body{margin: 0;padding: 0}
    img{display: block;width: 100%;height: auto;}
	#test{ width: 50%; height: auto; margin-left: auto; margin-right: auto; }
</style>

页面的body部分，将多个img标签放入一个div容器里，代码如下：

<div id="test">
    <img  src="images/1.png">
    <img  src="images/2.png">
    <img  src="images/3.png">
    <img  src="images/4.png">
    <img  src="images/5.png">
</div>

页面的底部，需引入jQuery库和图片预览插件，并启用插件，代码如下：

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/fly_zomm_img.min.js"></script>
<script type="text/javascript">
/**
 *  H5图标浏览插件
 *  支持多图识别切换
 *  支持手势放大,切换
 */
$(function (){
	$('#test').FlyZommImg();
})
</script>