关于Jqzoom的使用心得 jquery放大镜效果插件


Posted in Javascript onApril 12, 2010

下面是完整的代码 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" style="margin-top:100px;margin-left:100px;"> 
<a href="kawasakigreen.jpg" class="jqzoom" style="" title="kawasaki"> 
        <img src="kawasakigreen_small.jpg" title="kawasakigreen" style="border: 1px solid #666;"> 
</a><select style="position:absolute;left:400px;top:10px;"><option>sdsdsds</option></select> 
<br> 
<div class="notes"> 
<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 相关文章推荐
ExtJS 2.0实用简明教程之应用ExtJS
Apr 29 Javascript
jquery 日期分离成年月日的代码
May 14 Javascript
浅谈jQuery异步对象(XMLHttpRequest)
Nov 17 Javascript
javascript中checkbox使用方法简单实例演示
Nov 17 Javascript
javascript日期格式化方法小结
Dec 17 Javascript
JS定时器使用,定时定点,固定时刻,循环执行详解
May 31 Javascript
微信小程序 滚动到某个位置添加class效果实现代码
Apr 19 Javascript
JS给按钮添加跳转功能类似a标签
May 30 Javascript
实用的Vue开发技巧
May 30 Javascript
jQuery操作选中select下拉框的值代码实例
Feb 07 jQuery
vue打包npm run build时候界面报错的解决
Aug 13 Javascript
如何在CocosCreator里画个炫酷的雷达图
Apr 16 Javascript
Javascript 判断Flash是否加载完成的代码
Apr 12 #Javascript
使用dynatrace-ajax跟踪JavaScript的性能
Apr 12 #Javascript
javascript URL编码和解码使用说明
Apr 12 #Javascript
!DOCTYPE声明对JavaScript的影响分析
Apr 12 #Javascript
3Z版基于jquery的图片复选框(asp.net+jquery)
Apr 12 #Javascript
javascript cookies 设置、读取、删除实例代码
Apr 12 #Javascript
javascript cookies操作集合
Apr 12 #Javascript
You might like
新版mysql+apache+php Linux安装指南
2006/10/09 PHP
php zend 相对路径问题
2009/01/12 PHP
php根据isbn书号查询amazon网站上的图书信息的示例
2014/02/13 PHP
php判断电脑访问、手机访问的例子
2014/05/10 PHP
表单填写时用回车代替TAB的实现方法
2007/10/09 Javascript
Javascript YUI 读码日记之 YAHOO.util.Dom - Part.2 0
2008/03/22 Javascript
9个javascript语法高亮插件 推荐
2009/07/18 Javascript
JavaScript 编写匿名函数的几种方法
2010/02/21 Javascript
js检查页面上有无重复id的实现代码
2013/07/17 Javascript
简单分析javascript面向对象与原型
2015/05/21 Javascript
移动端js图片查看器
2016/11/17 Javascript
详解Nodejs基于mongoose模块的增删改查的操作
2016/12/21 NodeJs
JavaScript两个变量交换值的实现方法
2017/03/01 Javascript
详解JS实现简单的时分秒倒计时代码
2019/04/25 Javascript
小程序使用watch监听数据变化的方法详解
2019/09/20 Javascript
微信小程序 自定义弹窗实现过程(附代码)
2019/12/05 Javascript
使用Vue 自定义文件选择器组件的实例代码
2020/03/04 Javascript
[47:20]DAC2018 4.4 淘汰赛 Optic vs Mineski 第一场
2018/04/05 DOTA
Python日志模块logging简介
2015/04/13 Python
pandas获取groupby分组里最大值所在的行方法
2018/04/20 Python
python中pika模块问题的深入探究
2018/10/13 Python
对python特殊函数 __call__()的使用详解
2019/07/02 Python
处理python中多线程与多进程中的数据共享问题
2019/07/28 Python
利用Python的turtle库绘制玫瑰教程
2019/11/23 Python
利用Python pandas对Excel进行合并的方法示例
2020/11/04 Python
使用Python获取爱奇艺电视剧弹幕数据的示例代码
2021/01/12 Python
如何利用CSS3制作3D效果文字具体实现样式
2013/05/02 HTML / CSS
GUESS西班牙官方网上商城:美国服饰品牌
2017/03/15 全球购物
.net开发工程师面试题
2014/02/25 面试题
什么是虚拟内存?虚拟内存有什么优势?
2012/02/19 面试题
七年级生物教学反思
2014/01/30 职场文书
薪酬专员岗位职责
2014/02/18 职场文书
洗车工岗位职责
2014/03/15 职场文书
园艺专业毕业生求职信
2014/09/02 职场文书
员工激励培训演讲稿
2014/09/16 职场文书
企业党建工作总结2015
2015/05/26 职场文书