<ul class='ul_demo'> <li>支持移动设备触摸事件</li> <li>支持响应式</li> <li>支持放大/缩小</li> <li>支持旋转（类似微博的图片旋转）</li> <li>支持水平/垂直翻转</li> <li>支持图片移动</li> <li>支持键盘</li> <li>支持全屏幻灯片模式（可做屏保）</li> <li>支持缩略图</li> <li>支持标题显示</li> <li>支持多种自定义事件</li> </ul>
![[php框架] Smarty基础商品教程 Smarty入门教程 Smarty框架教程 共10课](https://jy.tp.yuanmeng.life/uploads/images/20210319/f47dc487eb949895833cd962fddc6a8b.jpg)
附件
<ul id="sucaihuo">
<li><img data-original="img/tibet-1.jpg" src="img/thumbnails/tibet-1.jpg" alt="图片1"></li>
<li><img data-original="img/tibet-2.jpg" src="img/thumbnails/tibet-2.jpg" alt="图片2"></li>
<li><img data-original="img/tibet-3.jpg" src="img/thumbnails/tibet-3.jpg" alt="图片3"></li>
<li><img data-original="img/tibet-4.jpg" src="img/thumbnails/tibet-4.jpg" alt="图片4"></li>
<li><img data-original="img/tibet-5.jpg" src="img/thumbnails/tibet-5.jpg" alt="图片5"></li>
<li><img data-original="img/tibet-6.jpg" src="img/thumbnails/tibet-6.jpg" alt="图片6"></li>
</ul><script src="js/viewer.min.js"></script>var viewer = new Viewer(document.getElementById('sucaihuo'), {
url: 'data-original'
});| 参数 | 描述 | 默认值 |
| inline | 启用 inline 模式 | false |
| button | 显示右上角关闭按钮（jQuery 版本无效） | true |
| navbar | 显示缩略图导航 | true |
| title | 显示当前图片的标题（现实 alt 属性及图片尺寸） | true |
| toolbar | 显示工具栏 | true |
| tooltip | 显示缩放百分比 | true |
| movable | 图片是否可移动 | true |
| zoomable | 图片是否可缩放 | true |
| rotatable | 图片是否可旋转 | true |
| scalable | 图片是否可翻转 | true |
| transition | 使用 CSS3 过度 | true |
| fullscreen | 播放时是否全屏 | true |
| keyboard | 是否支持键盘 | true |
| interval | 播放间隔，单位为毫秒 | 5000 |
| zoomRatio | 鼠标滚动时的缩放比例 | 0.1 |
| minZoomRatio | 最小缩放比例 | 0.01 |
| maxZoomRatio | 最大缩放比例 | 100 |
| zIndex | 设置图片查看器 modal 模式时的 z-index | 2015 |
| zIndexInline | 设置图片查看器 inline 模式时的 z-index | 0 |
| url | 设置大图片的 url | src |
| build | 回调函数，具体查看演示 | null |
| built | 回调函数，具体查看演示 | null |
| show | 回调函数，具体查看演示 | null |
| shown | 回调函数，具体查看演示 | null |
| hide | 回调函数，具体查看演示 | null |
| hidden | 回调函数，具体查看演示 | null |
| view | 回调函数，具体查看演示 | null |
| viewed | 回调函数，具体查看演示 | null |
*
回帖描述：*
链接类型：*
下载链接：
验证通过自动获取下载链接
*
描述：*
回帖描述：*
链接类型：*
阅读权限：*
下载链接：
微信客服
QQ客服
QQ群
