5kB插件给网站图片增加缩放效果

前言

有时候博客文章在放图片时，如果图片太小，根本看不清晰上面的文字~于是GitHub找了一个插件，非常Nice。名字叫：zoomify
围观地址：https://github.com/indrimuska/zoomify

Zoomify

Zoomify是一个简单的具有缩放效果的jQuery插件。

安装

下下来的源码，在dist目录下又如下文件

嗯~我们用min.的就行了。

<script src="https://code.jquery.com/jquery-2.1.4.min.js">script>
<script src="/dist/zoomify.min.js">script>
<link href="/dist/zoomify.min.css" rel="stylesheet">

教程

把zoomify.min.js和zoomify.min.js放置到网站中，位置嘛，通俗做法，css文件放头部，js文件放置底部，对了。别忘了引入Jquery~

初始化

<script type="text/javascript">
//作用域，哪个范围下的img标签可以缩放。我这里选择的是文章标签下的img 如果整个页面的话直接填img即可  
	$('#post-content img').zoomify();
</script>

效果

原效果

点图片后

是不是很赞啊~还很简单哦~

本文由 SAn 创作，采用知识共享署名4.0 国际许可协议进行许可
本站文章除注明转载/出处外，均为本站原创或翻译，转载前请务必署名
最后编辑时间为: 2018/04/27 18:34