关于Jqzoom的使用心得 jquery放大镜效果插件
关于Jqzoom的使用心得 jquery放大镜效果插件
发布时间:2016-12-30 来源:查字典编辑
摘要:下面是完整的代码jqzoom打包下载地址复制代码代码如下:JQzoomDemodiv.notes{font-size:12px;}div.n...

下面是完整的代码 jqzoom打包下载地址

复制代码 代码如下:

<html>

<head>

<title>JQzoom Demo</title>

<script src="../js/jquery-1.3.2.min.js" type="text/javascript"></script>

<script src="../js/jqzoom.pack.1.0.1.js" type="text/javascript"></script>

<link rel="stylesheet" href="../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 id="content">

<a href="kawasakigreen.jpg" title="kawasaki">

<img src="kawasakigreen_small.jpg" title="kawasakigreen">

</a><select><option>sdsdsds</option></select>

<br>

<div>

<small>created by Renzi Marco</small>

<a href="http://www.mind-projects.it/projects/jqzoom/contact.php">Hire me</a><br>

<a href="http://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>

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类