QZoom是一个基于最流行的jQuery的图片放大器插件。它功能强大,使用简便。支持标准模式、反转模式、无镜头、无标题的放大,并可以自定义jQZoom的窗口位置和渐隐效果,修正IE6的select bug。

配置参数

  • zoomType,默认值:’standard’,另一个值是’reverse’,是否将原图用半透明图层遮盖。
  • zoomWidth,默认值:200,放大窗口的宽度。
  • zoomHeight,默认值:200,放大窗口的高度。
  • xOffset,默认值:10,放大窗口相对于原图的x轴偏移值,可以为负。
  • yOffset,默认值:0,放大窗口相对于原图的y轴偏移值,可以为负。
  • position,默认值:’right’,放大窗口的位置,值还可以是:’right’ ,’left’ ,’top’ ,’bottom’。
  • lens,默认值:true,若为false,则不在原图上显示镜头。
  • imageOpacity,默认值:0.2,当zoomType的值为’reverse’时,这个参数用于指定遮罩的透明度。
  • title,默认值:true,在放大窗口中显示标题,值可以为a标记的title值,若无,则为原图的title值。
  • showEffect,默认值:’show’,显示放大窗口时的效果,值可以为: ‘show’ ,’fadein’。
  • hideEffect,默认值:’hide’,隐藏放大窗口时的效果: ‘hide’ ,’fadeout’。
  • fadeinSpeed,默认值:’fast’,放大窗口的渐显速度(选项: ‘fast’,'slow’,'medium’)。
  • fadeoutSpeed,默认值:’slow’,放大窗口的渐隐速度(选项: ‘fast’,'slow’,'medium’)。
  • showPreload,默认值:true,是否显示加载提示Loading zoom(选项: ‘true’,'false’)。
  • preloadText,默认值:’Loading zoom’,自定义加载提示文本。
  • preloadPosition,默认值:’center’,加载提示的位置,值也可以为’bycss’,以通过css指定位置。

在线演示

JQZoom 图片放大插件的使用的更多相关文章

  1. jquery图片放大插件鼠标悬停图片放大效果

    都知道jquery都插件是非常强大的,最近分享点jquery插件效果,方便效果开发使用. 一.HTML代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...

  2. 转载jQuery图片放大插件[twiPicZoom]

    转载http://xuzhihong1987.blog.163.com/blog/static/26731587201312821725913/ 功能说明: 双击查看大图,鼠标滚动放大缩小,能够切换到 ...

  3. 图片放大插件——elevatezoom

    GitHub地址:https://github.com/elevateweb/elevatezoom elevatezoom官网:http://www.elevateweb.co.uk/image-z ...

  4. 推荐两款简单好用的图片放大jquery插件

    一.zoomfiy.js 推荐可以从这里下载 使用说明: 使用该jquery 插件引入该插件的js:zoomfiy.js 或 min引入该插件的css:zoomfiy.css 或 min前后顺序都可j ...

  5. jqzoom图片放大镜

    jqzoom是一个图片放大器插件.它功能强大,使用简便! 引入js与css: <script type="text/javascript" src="js/jque ...

  6. jqzoom插件图片放大功能的一些BUG

    建议使用cloud-zoom插件,jqzoom插件就不要使用了 点击查看——图片放大镜——jQuery插件Cloud Zoom 刚开始使用的是jqzoom插件,但问题太多了,就不说插入到页面中使用了, ...

  7. 基于jQuery的图片相册滑出放大插件

    今天给大家带来一款基于jQuery的图片相册滑出放大插件.点击相册图片,展示该图片.该插件适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗..效 ...

  8. jQuery.YesShow - 图片轮播插件(带图片放大功能)

    jQuery.YesShow - 图片轮播插件(带图片放大功能) 使用简单,原文件只要这样就可以了:<div id="yes">         <ul> ...

  9. 一款基于jQuery可放大预览的图片滑块插件

    今天给大家分享一款基于jQuery可放大预览的图片滑块插件.这款jQuery焦点图插件的特点是可以横向左右滑动图片,并且点击图片可以进行放大预览,唯一的缺陷是这款焦点图并不能循环切换,如果你有较好的J ...

随机推荐

  1. inux环境PHP7.0安装

    inux环境PHP7.0安装   PHP7和HHVM比较PHP7的在真实场景的性能确实已经和HHVM相当, 在一些场景甚至超过了HHVM.HHVM的运维复杂, 是多线程模型, 这就代表着如果一个线程导 ...

  2. ECSHOP后台商品列表显示商品缩略图

    ECSHOP后台商品列表显示商品缩略图 ECSHOP教程/ ecshop教程网(www.ecshop119.com) 2013-11-06   ecshop 后台商品列表显示商品缩略图,大楷步凑如下: ...

  3. 锋利的jQuery-4--animate()的用法

    1.一般动画: $("btn").click(function(){ $("div").animate({"left" : "+= ...

  4. Iterator&Vector应用实例

    public class test1 { /** * @param args */ public static void main(String[] args) { // TODO Auto-gene ...

  5. Mongodb c#增删改查

    写在前面 最近项目需要,就研究了下mongodb,也是为了快速上手,就自己弄了一个简单的例子,这里记录一下. Mongodb 传统的关系数据库一般由数据库(database).表(table).记录( ...

  6. 没玩过这些微信小游戏你就out了

    你确定没玩过下面这些微信小游戏?是不是有点out了?赶紧添加微信号kangfuyk,回复H5马上畅玩! 当然了,扫一下二维码关注后回复H5更快捷噢! 微信小游戏列表,持续更新中 辨色大比拼!心理游戏 ...

  7. springmvc 定时器

    CronTrigger配置格式: 格式: [秒] [分] [小时] [日] [月] [周] [年] 序号 说明  是否必填  允许填写的值 允许的通配符 1  秒  是  0-59    , - *  ...

  8. Unity3D研究院之自制批量关联材质与贴图插件

    原地址:http://www.xuanyusong.com/archives/2314 美术做过的模型导出fbx,美术把Fbx和贴图文件给了程序,程序把Fbx导入工程可能会出现贴图和材质没有关联上的问 ...

  9. 在rails下新建表

    (文章都是从我的个人主页上粘贴过来的,大家也可以访问我的主页 www.iwangzheng.com) 今天需要新建表,以下是建表语句 rails generate scaffold users ema ...

  10. MogileFS 的介绍(MogileFS 系列1)[分布式文件系统]

    MogileFS 是一个开源的分布式文件系统,用于组建分布式文件集群,由 LiveJournal 旗下 Danga Interactive 公司开发,Danga 团队开发了包括 Memcached.M ...