mui点击小图放大预览

所需代码https://github.com/Yanglepin/imageView

1. 引用css文件

<link rel="stylesheet" href="css/imageview.css" />
<link rel="stylesheet" href="css/mui.imageviewer.css" />

2. 引用js文件

<script type="text/javascript" src="js/mui.imageViewer.js" ></script>
<script type="text/javascript" src="js/mui.previewimage.js" ></script>
<script type="text/javascript" src="js/mui.zoom.js" ></script>

3. mui初始化之后调用mui.previewImage()方法

mui.previewImage();

4. 预览的小图需要两个属性

<img src="demo.png" data-preview-src="" data-preview-group="4">  
 //data-preview-src(没有这个属性，Js无法抓取图片)
//data-preview-group(设定为一个组的图片,一个组有多少图片，左上角数字显示就有多少)