jQZoom 使用说明
下面介绍下简单使用:
1. 在你的页面中包含 jqzoom.css
<link rel="stylesheet" href="your_path/jqzoom.css" type="text/css" media="screen">
2. 包含 jQzoom 和 jQuery JS 代码:
<script type="text/javascript" src="your_path/jquery.js"></script>
<script type="text/javascript" src="your_path/jquery.jqzoom.js"></script>
3. 现在创建一个放图片的容器(最好是 DIV),并给 class 赋值为 jqzoom,然后给每张图片设置一个 jqimg 属性,它的值为大图的地址。
<div class="jqzoom"><img src="images/shoe4_small.jpg" alt="shoe" jqimg="images/shoe4_big.jpg"></div>
4. 当页面导入的时候,载入 jQZoom 插件。
$(document).ready(function(){ $(".jqzoom").jqueryzoom(); });
好了基本设置好了,当然你也可以自己做些简单的设置:
$(document).ready(function(){
$(".jqzoom").jqueryzoom({
xzoom: 300, //设置放大 DIV 长度(默认为 200)
yzoom: 300, //设置放大 DIV 高度(默认为 200)
offset: 10, //设置放大 DIV 偏移(默认为 10)
position: "right", //设置放大 DIV 的位置(默认为右边)
preload:1,
lens:1
});
});
分享到:
相关推荐
之前为了做一个放大效果,下载了jqzoom的一个例子来看,自己改良和修改了其中...现在把自己用过的2个例子放出来,加上自己遇到的一些重点和难点予以说明,希望能帮到其他需要使用的人,我QQ273499909,不懂可以M我。
jqzoom jqzoom jquery
jqzoom2.3,能让你的图片放大,本插件小巧实用,另附示例代码和jqzoom2.3文档,傻瓜式操作
jqZoom放大镜,淘宝放大镜,jqZoom.js,网络络上大多数jqZoom的实例都不全 或有缺陷,我这个是完整的 代码清晰,兼容IE7
jquery.jqzoom.js图片处理挺不错的
jqzoom,商城图片放大器,大部分主流商城都是用该代码
最新 jqzoom 例子 图片很给力 快下载吧
* JQZoom Evolution 1.0.1 - Javascript Image magnifier * * Copyright (c) Engineer Renzi Marco(www.mind-projects.it) * * $Date: 12-12-2008 * * ChangeLog: * * $License : GPL,so any change to ...
zencart1.3.*可用 zencart图片放大插件,集成版 JQLightBox+JQZoom集成
JQUERY 放大镜效果jqzoom_v2.2.rar JQUERY 放大镜效果jqzoom_v2.2.rar JQUERY 放大镜效果jqzoom_v2.2.rar JQUERY 放大镜效果jqzoom_v2.2.rar
jqzoom 放大镜插件 找了好久才找到的。一定是你需要的。
jquery插件jqzoom放大镜,动态获取json数据
jquery jqzoom插件制作图片放大镜图片窗口放大显示 jquery jqzoom插件制作图片放大镜图片窗口放大显示
jcarousel+jqzoom 实现图片滚动和局部图片放大镜效果,电子商务网站商品展示特效
jqzoom v2.0 基于jQuery的图片放大插件,以前发过1.0版本的,2.0比1.0功能扩展了更多,功能更强大,也是目前使用最顺手的一个版本,压缩包内附带有官方实例,使用方法什么的通过代码应该就能看得懂,jqzoom被广泛...
放大镜jqzoom_ev-2.3 基于jQuery开发的图片放大镜插件
NULL 博文链接:https://liuzidong.iteye.com/blog/1152132
NULL 博文链接:https://htj1231825.iteye.com/blog/908368