jquery图片放大功能简单实现

<divclass="jqzoom">
<imgsrc="http://bfbnews.tw/images/test.jpg"id="bigImg"style="width:500px;height:300px;"jqimg="http://bfbnews.tw/images/test.jpg">
</div>
<scriptsrc="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<styletype="text/css">
body{margin:0px;}
div.zoomdiv{
z-index:999;
position:absolute;
top:0px;
left:0px;
width:200px;
height:200px;
background:#ffffff;
border:1pxsolid#CCCCCC;
display:none;
text-align:center;
overflow:hidden;
}
div.jqZoomPup{
z-index:999;
visibility:hidden;
position:absolute;
top:0px;
left:0px;
width:50px;
height:50px;
border:1pxsolid#aaa;
background:#ffffff;
opacity:0.5;
-moz-opacity:0.5;
-khtml-opacity:0.5;
filter:alpha(Opacity=50);
}
</style>
<scripttype="text/javascript">
$(document).ready(function(){
$(".jqzoom").jqueryzoom({
xzoom:400,//设置放大DIV长度（默认为200）
yzoom:400,//设置放大DIV高度（默认为200）
offset:10,//设置放大DIV偏移（默认为10）
position:"right",//设置放大DIV的位置（默认为右边）
preload:1,
lens:true
});
});
</script>
<!--{includefile="jqzoom_js.html"}-->