关于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 相关文章推荐
鼠标图片振动代码
Jul 06 Javascript
使用js在页面中绘制表格核心代码
Sep 16 Javascript
jquery中获得元素尺寸和坐标的方法整理
May 18 Javascript
详解javascript中原始数据类型Null和Undefined
Dec 17 Javascript
JS实现环形进度条(从0到100%)效果
Jul 05 Javascript
d3.js中冷门却实用的内置函数总结
Feb 04 Javascript
easyui combogrid实现本地模糊搜索过滤多列
May 13 Javascript
深入理解Angularjs中$http.post与$.post
May 19 Javascript
把vue-router和express项目部署到服务器的方法
Feb 21 Javascript
vue项目使用.env文件配置全局环境变量的方法
Oct 24 Javascript
Vue使用v-viewer实现图片预览
Oct 21 Javascript
vant-ui组件调用Dialog弹窗异步关闭操作
Nov 04 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简单系统查询模块代码打包下载
2008/06/07 PHP
PHP学习之正则表达式
2011/04/17 PHP
PHP轻量级数据库操作类Medoo增加、删除、修改、查询例子
2014/07/04 PHP
php生成随机颜色的方法
2014/11/13 PHP
Django中通过定时任务触发页面静态化的处理方式
2018/08/29 PHP
Laravel获取所有的数据库表及结构的方法
2019/10/10 PHP
关于IFRAME 自适应高度的研究
2006/07/20 Javascript
JS的IE和Firefox兼容性集锦
2006/12/11 Javascript
Java 正则表达式学习总结和一些小例子
2012/09/13 Javascript
JavaScript中的style.display属性操作
2013/03/27 Javascript
js图片自动轮播代码分享(js图片轮播)
2014/05/06 Javascript
jquery控制select的text/value值为选中状态
2014/06/03 Javascript
Blocksit插件实现瀑布流数据无限( 异步)加载
2014/06/20 Javascript
封装好的一个万能检测表单的方法
2015/01/21 Javascript
js事件处理程序跨浏览器解决方案
2016/03/27 Javascript
jQuery解析返回的xml和json方法详解
2017/01/05 Javascript
JS控件bootstrap datepicker使用方法详解
2017/03/25 Javascript
vue中echarts3.0自适应的方法
2018/02/26 Javascript
vue自定义filters过滤器
2018/04/26 Javascript
echarts整合多个类似option的方法实例
2018/07/10 Javascript
jQuery实现的导航条点击后高亮显示功能示例
2019/03/04 jQuery
[01:08:33]OG vs VGJ.T 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
python3中利用filter函数输出小于某个数的所有回文数实例
2019/11/24 Python
Python3.5 win10环境下导入kera/tensorflow报错的解决方法
2019/12/19 Python
Python文本处理简单易懂方法解析
2019/12/19 Python
Python分类测试代码实例汇总
2020/07/23 Python
pytorch __init__、forward与__call__的用法小结
2021/02/27 Python
HTML5在canvas中绘制复杂形状附效果截图
2014/06/23 HTML / CSS
html5利用canvas实现颜色容差抠图功能
2019/12/23 HTML / CSS
数字化校园建设方案
2014/05/03 职场文书
文秘班元旦晚会活动策划方案
2014/08/28 职场文书
大学生党员批评与自我批评
2014/09/28 职场文书
高中班主任评语
2014/12/30 职场文书
世界遗产导游词
2015/02/13 职场文书
离婚起诉书范文2016
2015/11/26 职场文书
SpringMVC 整合SSM框架详解
2021/08/30 Java/Android