码迷,mamicode.com
首页 > Web开发 > 详细

解决 viewer.js 动态更新图片导致无法预览的问题

时间:2019-05-14 15:07:40      阅读:705      评论:0      收藏:0      [点我收藏+]

标签:update   div   官方文档   ref   mic   col   oom   使用   image   

1、viewer.js 使用 Demo

http://fengyuanchen.github.io/viewerjs/

2、viewer.js 下载地址

https://github.com/fengyuanchen/viewerjs

3、viewer只能初始化一次,也就是说如果用ajax添加了新的图片,你再初始化新添加的图片还是出不来,只有第一次初始化加载的图片

4、解决方案

参看官方文档:

技术图片

5、具体代码实例

 1 $.post(‘your_url‘, {
 2     param: ‘value‘
 3 }, function(data) {
 4     var html = ‘‘;
 5     for (var i = data.length - 1; i >= 0; i--) {
 6         html += ‘<li><img src="img_source" ></li>‘
 7     }
 8     $("#img_list").append(html);
 9     // 初始化 viewer.js
10     var viewer = new Viewer(document.getElementById(‘img_list‘), {
11         toolbar: true,  //显示工具条
12         viewed() {
13             viewer.zoomTo(0.75);   // 图片显示比例 75%
14         },
15         show: function (){        // 动态加载图片后,更新实例
16             viewer.update();
17         },
18     });
19 });     

 

解决 viewer.js 动态更新图片导致无法预览的问题

标签:update   div   官方文档   ref   mic   col   oom   使用   image   

原文地址:https://www.cnblogs.com/whx-blogs/p/10861981.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!