Jqzoom是基于jquery的放大镜效果插件，兼容多款浏览器，喜欢的朋友可以测试下。
下面是完整的代码 jqzoom打包下载地址
复制代码 代码如下:
<html>
<head>
<title>JQzoom Demo</title>
<script src="https://www.jb51.net/js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="https://www.jb51.net/js/jqzoom.pack.1.0.1.js" type="text/javascript"></script>
<link href="https://www.jb51.net/css/jqzoom.css" type="text/css">
<style type"text/css">
div.notes{
font-size:12px;
}
div.notes a{
color:#990000;
}
</style>
<script type="text/javascript">
$(function() {
$(".jqzoom").jqzoom();
});
</script>
</head>
<body>
<div>
<a href="https://www.jb51.net/kawasakigreen.jpg" title="kawasaki">
<img src="https://www.jb51.net/kawasakigreen_small.jpg" title="kawasakigreen">
</a><select><option>sdsdsds</option></select>
<br>
<div>
<small>created by Renzi Marco</small>
<a href="https://www.mind-projects.it/projects/jqzoom/contact.php">Hire me</a><br>
<a href="https://www.mind-projects.it/projects/jqzoom">view all Demos</a>
</div>
</div>
</body></html>
下面主要演示Jqzoom的方法！推荐一下！
复制代码 代码如下:
<script type="text/javascript">
window.onload = function() {
$(".jqzoom").jqueryzoom({
xzoom: 250, //设置放大 DIV 长度（默认为 200）
yzoom: 250, //设置放大 DIV 高度（默认为 200）
offset: 10, //设置放大 DIV 偏移（默认为 10）
position: "right", //设置放大 DIV 的位置（默认为右边）
preload: 1,
lens: 1
});
}
</script>
您可能感兴趣的文章: