前端之家收集整理的这篇文章主要介绍了
博客中添加图片查看器（支持图片查看、放大、缩小、翻转、切换、旋转） ，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
@R_301_161@
<!DOCTYPE html>
<html lang="zh-Hans"headMeta charset="utf-8"title>JS/jQuery图片查看器viewer.js演示-默认效果_jq22</link rel="stylesheet" href="css/viewer.min.css"style>
* { margin: 0; padding}
#jq22 width 50% 0 auto font-size
#jq22 li display inline-block 32% margin-left 1% padding-top
#jq22 li img 100%
h1 40px auto font 32px "Microsoft Yahei" text-align center}
bodyh1>默认效果ul id="jq22"li><img data-original="http://a.hiphotos.baidu.com/zhidao/pic/item/279759ee3d6d55fb9ae54e286d224f4a20a4dd98.jpg" src alt="图片1"></="图片2"="图片3"="图片4"="图片5"="图片6"ulscript src="js/viewer.min.js"script>
var viewer = new Viewer(document.getElementById('jq22),{
url: data-original
});
>
html>
引用 js
引用 css
下载资源
博客设置中 页脚HTML 代码 添加以下代码
⭐目前存在BUG：代码块复制图标点击也会显示出来图片放大
="https://files.cnblogs.com/files/xqz0618/viewer.min.css"="https://files.cnblogs.com/files/xqz0618/viewer.min.js">
Viewer($(.postBody)[0],{
url:
});
>
