银狐给网站改用了新的图片放大jq插件:zoomfiy,简单简洁。原来使用的zoom在移动端有bug,zoomfiy则没有。

点击文章图片放大jquery插件

zoomfiy.js

​下载地址:http://www.htmleaf.com/jQuery/Lightbox-Dialog/201606193618.html

使用方法

使用该图片放大预览插件需要在页面中引入 jqueryzoomify.min.js 以及样式文件 zoomify.min.css

<link href="path/to/dist/zoomify.min.css" rel="stylesheet">
<script src="path/to/jquery-2.1.4.min.js"></script>
<script src="path/to/dist/zoomify.min.js"></script>

zoomooz.js

下载地址:http://www.oschina.net/p/zoomooz?fromerr=WiAVwEHF

使用说明:

Zoomooz.js 是一个易用的 jQuery 插件让网页的元素可进行优雅的缩放操作,特别适用相册网站。

这种图像方法不是单独放大单个图像,而是单击图像区域将整个放大该区域,有时会导致该区域放大的位置不正确。

点击图像的其他部分可以返回到要放大内容之前的状态,效果非常好。需要引用jquery和zoomooz.js,以实现简单的图片放大功能。如果想要实现更复杂的功能,要在父级等标签上加上不同的class和js。具体看说明文档

以上两个插件是我尝试过的众多插件中最好,最简单的,还有许多其他图像放大插件 感兴趣的朋友可以了解下。

比如:

swipebox

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

zoom.js

该插件使用非常简单,只需在需要放大的图像上添加一个 data-action="zoom" 就行了,但是很多时候会报错或者移动端没法正常放大

目前尚不清楚该错误的具体原因。

当项目结构复杂时,更容易出现错误,导致单击图像时会出现了小小的bug。

缺点:没有帮助文档,无法找到相关文章(有相关文章,而且很详细)

优点:适用于放大简单页的img放大,效果还是很不错的!

fancybox

插件优点:功能齐全,值得研究