博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
推荐两款简单好用的图片放大jquery插件
阅读量:5901 次
发布时间:2019-06-19

本文共 860 字,大约阅读时间需要 2 分钟。

一、zoomfiy.js

使用说明:

使用该jquery 插件

引入该插件的js:zoomfiy.js 或 min
引入该插件的css:zoomfiy.css 或 min
前后顺序都可
js里加入 调用插件的函数 $('这里写要放大的图片').zoomify();
如果有ajax 新生成的图片,要在ajax里再次调用一遍该函数。

二、zoomooz.js

使用说明:

 

这个插件有很多种 放大功能,可进行优雅的缩放操作,特别适用相册网站。这个图片方法不是 单独图片跳脱出来的放大,而是点击该图片区域,这个区域的页面整体放大,有时候会导致放的的区域不准的情况。点击图片其他部分可以回到要放大的内容之前的状态,效果很炫酷。

必须引用一定有jquery和zoomooz.js
给要放大的元素加 class="zoomTarget"
即可实现简单的放大功能,
如果实现更加复杂的功能,
要在他的父级等标签上继续加 不同的class ,加一些js ,具体参见说明文档

 

以上两个插件是我试过众多插件中最好用最简单的,还有许多其他图片放大插件,有兴趣的朋友可以学习下。

比如:

swipebox

该插件好处:有具体的使用说明文档,貌似是要给点击的图片加一个a标签,在a标签上加相应的class。

zoom.js

该插件使用起来非常简单,直接给需要放大的图片加一个 data-action="zoom"即可,但是很多时候会报错:Cannot read property 'end' of undefined 和 Cannot read property '0' of undefined 

具体报错原因,目前还不明白,在本身项目结构复杂的时候应用最容易出现该错误,导致图片点击出现一点小小的Bug.

缺点:没有帮助文档,网上搜不到相关帖子

优点:适用于简单页面的图片放大,效果棒!

fancybox

该插件功能齐全,值得研究

 

转载于:https://www.cnblogs.com/beileixinqing/p/6179897.html

你可能感兴趣的文章
第三课--Android组件
查看>>
LoadRunner监控Linux资源
查看>>
多核心Linux内核路径优化的不二法门之-slab与伙伴系统
查看>>
Cacti 0.8.8b 成功监控mssql 2005
查看>>
你所不知道的Kerberos 整理笔记(三)
查看>>
阿里云 DataV 产品简介
查看>>
snmp日志
查看>>
Windows 10预览版之抢先体验—短命的METRO界面
查看>>
串口ic读卡器源码-c#代码
查看>>
虚拟机安装与概述(1)
查看>>
使用Python一年多了,总结八个好用的Python爬虫技巧
查看>>
网页首页广告显示缓慢向上消失
查看>>
组播学习笔记(二)IGMP协议
查看>>
清华大学:模拟电子技术基础
查看>>
Java中常用的内存区域
查看>>
使用Nginx容器
查看>>
中级学员:2015年10月15日作业
查看>>
Filebeat 日志收集器 安装和配置
查看>>
磁盘和文件系统管理
查看>>
基于SaltStack完成LVS的配置管理
查看>>