Jquery 实现放大镜效果 jqzoom插件

先看图片：



代码：

Css樣式引用:


<link href="CSS/jqzoom.css" rel="stylesheet" type="text/css" />
javascript引用:

<script src="JqueryLib/jquery-1.3.2.js" type="text/javascript"></script><script src="JqueryLib/jquery.jqzoom.js" type="text/javascript"></script>
客戶端代碼:

<div class="jqzoom"><img src="Images/shoe1_small.jpg" alt="shoe" jqimg="Images/shoe1_big.jpg" /></div>
javascript代碼:

$(document).ready(function() {
//$(".jqzoom").jqueryzoom();不帶任何設置的應用

$(".jqzoom").jqueryzoom({
xzoom: 300, //放大圖片之寬(默認是200)
yzoom: 300, //放大圖片之高(默認是200)
offset: 20, //與原來圖片距離(默認是10)
position: "right", //相對原來圖片的位置(默認是right)
preload: 1, // 默認是1
lens: 1 //是否顯示小圖片放大鏡頭 默認是1
});
})

来自：/article/5445851.html