Viewer.js 实现动态预览功能

viewer.js是一款功能强大的照片查看器，只需引入viewer.css和viewer.js即可使用，主要参数如下

因为要通过ajax获取图片列标，所以此处有显示和销毁处理。首先创建一个容器，如下：

<div class="test" id="test" style="display: none;"></div>

接着编写ajax代码动态给容器中添加图片，如下：

//创建元素
			$('body').on('click','.showHd',function(){
				var id = $(this).data('id');
				$.post("{:url('ajax/productImgs')}",{id:id},function(res){
					var str = '';
					if(res.code === 0){
						$.each(res.data,function(index,item){
							str += '<img data-original='+item+' src='+item+' />';
						});
						$('#dowebok').empty().append(str);
						//图片查看器
						var viewer = new Viewer(document.getElementById('dowebok'), {
							url: 'data-original',
							title:false,
							show:function(){
								viewer.update()
							},
							hide:function(){
								viewer.destroy();
							}
						});
						viewer.show();
					}
				});
			});

至此，已基本完成，不destroy关闭后下次再打开会报错。