sfr持正的网站需要做一个产品图片鼠标移动上去会有放大的功能，也就是图片放大镜效果。

可以用cloudzoom.js插件，简单易用

先看效果图

下面是使用方法：

页面头部或底部引用 css 和 js 文件

<link type=”text/css” rel=”stylesheet” href=”css/cloudzoom.css”>
<script type=”text/javascript” src=”js/cloudzoom.js”></script>

js代码

CloudZoom.quickStart();

html代码

<img class="cloudzoom" data-cloudzoom="zoomImage: 'tupian.jpg'" src="tupian.jpg"/>

给需要放大镜效果的图片加上 class=”cloudzoom”和 data-cloudzoom=”zoomImage: ‘tupian.jpg'”就可以了。

单张或多张图片都是可以的，完美。