Viewer.js网页图片查看器的使用

user

雨橙

中国.四川.成都

世界之上、唯有远见、惟爱不变。


今天在博客使用的时候。发现图片比较小。这个是由于博客的排版布局风格决定的。没有办法。
然后我就想实现一个功能。后台发布图片的时候。自动就绑定JS查看大图的效果。

后来我在网站找到这个插件,非常好用。有需要的朋友可以找我拿去。


主要核心代码如下:
<link rel="stylesheet" href="/templets/blog/css/viewer.min.css">
<script src="/templets/blog/js/viewer.min.js"></script>
<script type="text/javascript">
/*
var viewer = new Viewer(document.getElementById('postsection'), {
	url: 'data-original'
});
*/
var viewer = new Viewer(document.getElementById('postsection'));
</script>

使用的时候引入CSS包:
<link rel="stylesheet" href="http://www.dowebok.com/demo/192/css/viewer.min.css">

然后引入JS包及代码:
<script src="http://www.dowebok.com/demo/192/js/viewer.min.js"></script>
<script type="text/javascript">
var viewer = new Viewer(document.getElementById('postsection'));
</script>


#postsection这个是编辑器容器的ID这个一般在模版文件中加入即可。


Viewer.js来源于网站:http://www.dowebok.com/demo/192/
posted at