建议使用cloud-zoom插件,jqzoom插件就不要使用了

点击查看——图片放大镜——jQuery插件Cloud Zoom

刚开始使用的是jqzoom插件,但问题太多了,就不说插入到页面中使用了,就单单插件本身带的实例

Bug1:先天性营养不良

你就不能使用margin:0 auto;把它放到一个居中显示的模块。也只能靠窗口最左边显示,要不就是用margin-left让它靠左边一定距离显示,但你要想让它想一般的网站里能适应不同宽度的浏览器,怕是不好用了。

Bug2:后天发育不足

jqzoom受外围模块的影响,刚开始发现的是在IE下显示正常,在webkit内核的极速浏览器下,就没有放大效果了。于是就花了好久时间把整个主体内的模块一层一层的调,才发现是跟jqzoom插件所在的层同一级的一个分享模块影响了它,然后就调整那个分享模块的位置,不幸的是,整个页面不能出现那个分享模块,只要出现,图片的放大效果就受到影响。这就说明这个插件扩展性太差,单独的模块怎么能收外围环境的影响呢!

辛苦的调试历程:

从刚开始发现问题,一连调了两天,可一个问题好不容易解决了,另一个问题又出现了,调到最后,发现了它先天性的BUG——无法再w3c标准下,使用margin:0 auto;让它居中。这就没办法了,真是扶不起来的阿斗啊。。。
所以,有需要图片放大功能的朋友们推荐使用cloud-zoom把,兼容性强,就把原来的js文件和样式换成cloud-zoom插件的文件,几乎就没再调什么,完美的图片放大功能就出来了,去不同内核的浏览器去测试了下,都没一点问题!

jqzoom插件图片放大功能的一些BUG的更多相关文章

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

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

  2. Typora配置双击图片放大功能

    在Typora中,默认没有点击图片放大功能,本文就教大家如何配置该功能. 我的环境版本 Typora版本:0.11.13 LightBox版本:2.11.3 下载LightBox 可以从Github下 ...

  3. 图片放大功能如何做?jquery实现

    花了很长时间撸了个网站,观点,其中需要一个图片放大功能,网上找了半天发现都没有中意的,最后无奈之下自己写了一个,演示地址,演示图片: 自我感觉效果还不错,现在分享开来给大家看看,哪里不好还请多多指教, ...

  4. 图片放大功能插件及jquery.extend函数理解

    前端时间,产品提出社区评论中的图片需要有放大功能.感觉可以共用,所以就想整合一个插件,过程中也借鉴了一些例子. 分析下自己的代码思路: var scaleImg = function(opts) { ...

  5. JavaScript 点击图片放大功能

    <!doctype html> <html> <head> <meta charset="utf-8" /> <title&g ...

  6. jquery图片放大功能简单实现

    图片放大在某些例如商品细节放大图比较常见,本文写了一个图片放大的示例适合日常应付,有需求的朋友可以参考下 <div class="jqzoom"> <img sr ...

  7. 使用Layer完成图片放大功能

    序言:在写这个功能之前也用了zoom.js,zoom.js用起来简单引用js然后设置图片属性就可以放大.但是放大后的图片模糊.没有遮罩.在放大图片时其它图片布局会受到影响,当然如果觉得这些都是小问题的 ...

  8. 微信sdk 图片上传 两种方法 上传一张显示一张 并附带微信图片放大功能和删除功能

    html <!--上传图片--> <div class="upload-mod"> <div class="up-box" id= ...

  9. html实现点击图片放大功能

    话不多说,直接上代码 <html> <head> <style> .over {position: fixed; left:0; top:0; width:100% ...

随机推荐

  1. github打开慢,页面打不开,请求老是失败问题修复总结

    感谢老铁 QQ(1218624820) 提供的方法建议 原因来自于DNS污染, 到下面的目录进行修改文件 C:\Windows\System32\drivers\etc 在后面粘贴下面的信息 192. ...

  2. How to convert a QString to unicode object in python 2?

    How to convert a QString to unicode object in python 2? I had this problem to solve, and I tried to ...

  3. vim没有权限却可以强制保存时所引起的思考 ------ 文件夹权限对所属文件的权限影响

    最近在拿着Linux 鸟叔私房菜对着Linux 系统学习一下基本操作,虽然已经使用Linux系统已经好多年不过却一直没有系统的学习一下.在用vim 编辑一个文件的时候出现了一个很神奇的事情,明明该文件 ...

  4. Codeforces 1009D:Relatively Prime Graph

    D. Relatively Prime Graph time limit per test 2 seconds memory limit per test 256 megabytes input st ...

  5. 无线路由器的加密模式WEP,WPA-PSK(TKIP),WPA2-PSK(AES) WPA-PSK(TKIP)+WPA2-PSK(AES)。

    目前无线路由器里带有的加密模式主要有:WEP,WPA-PSK(TKIP),WPA2-PSK(AES)和WPA-PSK(TKIP)+WPA2-PSK(AES). WEP(有线等效加密)WEP是Wired ...

  6. streamsets Processors 说明

    Processors 表示对于一种数据操作处理,在pipeline中可以应用多个Processors, 同时根据不同的执行模式,可以分为独立模式的,集群模式.边缘模式(agent),以及 帮助测试的测 ...

  7. Maven(4)-利用intellij idea创建maven 多模块项目

    本文通过一个例子来介绍利用maven来构建一个多模块的jave项目.开发工具:intellij idea. 一.项目结构 multi-module-project是主工程,里面包含两个模块(Modul ...

  8. 微信小程序详解——页面之间的跳转方式【路由】和参数传递

    微信小程序拥有web网页和Application共同的特征,我们的页面都不是孤立存在的,而是通过和其他页面进行交互,来共同完成系统的功能.今天我们来研究小程序页面之间的跳转方式. 1.先导 在Andr ...

  9. Hadoop编译安装

    本文转载自:http://www.cnblogs.com/shishanyuan/p/4701646.html 1.编译Hadooop 1.1 搭建环境 1.1.1 安装并设置maven 1. 下载m ...

  10. [Android] 开发第八天

    View 类是所有 UI组件的基类,它包含的 XML 属性和方法是所有组件都可使用的. ViewGroup 继承了 View 类,主要当作容器类使用,它是一个抽象类,实际使用中会使用它的子类作为容器. ...