关于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 相关文章推荐
JavaScript继承方式实例
Oct 29 Javascript
Javascript动态创建div的方法
Feb 09 Javascript
ECMAScript中函数function类型
Jun 03 Javascript
jquery操作select元素和option的实例代码
Feb 03 Javascript
Ionic如何实现下拉刷新与上拉加载功能
Jun 03 Javascript
Angularjs在初始化未完毕时出现闪烁问题的解决方法分析
Aug 05 Javascript
echarts学习笔记之箱线图的分析与绘制详解
Nov 22 Javascript
通过vue-cli3构建一个SSR应用程序的方法
Sep 13 Javascript
vue中使用微信公众号js-sdk踩坑记录
Mar 29 Javascript
详解如何理解vue的key属性
Apr 14 Javascript
JavaScript实现五子棋游戏的方法详解
Jul 08 Javascript
Javascript中的解构赋值语法详解
Apr 02 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
PHP调用三种数据库的方法(1)
2006/10/09 PHP
说说PHP的autoLoad自动加载机制
2012/09/27 PHP
PHP通过插入mysql数据来实现多机互锁实例
2014/11/05 PHP
PHP中抽象类和抽象方法概念与用法分析
2016/05/24 PHP
PHP实现抽奖功能实例代码
2020/06/30 PHP
基于ThinkPHP删除目录及目录文件函数
2020/10/28 PHP
关于文本限制字数的js代码
2007/04/02 Javascript
JS俄罗斯方块,包含完整的设计理念
2010/12/11 Javascript
document.getElementById介绍
2011/09/13 Javascript
jquery ajax 局部刷新小案例
2014/02/08 Javascript
鼠标悬浮显示二级菜单效果的jquery实现
2014/10/29 Javascript
node.js中的fs.fsync方法使用说明
2014/12/15 Javascript
js实现改进的仿蓝色论坛导航菜单效果代码
2015/09/06 Javascript
JavaScript缓冲运动实现方法(2则示例)
2016/01/08 Javascript
解决bootstrap导航栏navbar在IE8上存在缺陷的方法
2016/07/01 Javascript
使用vue.js编写蓝色拼图小游戏
2017/03/17 Javascript
微信小程序 POST请求的实例详解
2017/09/29 Javascript
浅谈angular2子组件的事件传递(任意组件事件传递)
2018/09/30 Javascript
vue-cli 2.*中导入公共less文件的方法步骤
2018/11/22 Javascript
javascript canvas API内容整理
2020/02/16 Javascript
Python的ORM框架SQLAlchemy入门教程
2014/04/28 Python
python3新特性函数注释Function Annotations用法分析
2016/07/28 Python
python编程实现希尔排序
2017/04/13 Python
Python实现将sqlite数据库导出转成Excel(xls)表的方法
2017/07/17 Python
python使用 HTMLTestRunner.py生成测试报告
2017/10/20 Python
python不换行之end=与逗号的意思及用途
2017/11/21 Python
详解Python的循环结构知识点
2019/05/20 Python
赫里福德的一家乡村零售商店:Philip Morris & Son
2017/06/25 全球购物
Python里面如何拷贝一个对象
2014/02/17 面试题
介绍一下Java中的static关键字
2012/05/12 面试题
精彩的大学生自我评价
2013/11/17 职场文书
机械电子工程专业求职信
2014/06/22 职场文书
2014年客户经理工作总结
2014/11/20 职场文书
2014年小学工作总结
2014/11/26 职场文书
结婚通知短信怎么写
2015/04/17 职场文书
你需要掌握的20个Python常用技巧
2022/02/28 Python