layui layer 弹窗组件显示图片

layer 弹窗显示表格中的图片。

选用layer.photos 实例化

layer.photos({
  photos: '#img_' + id,
  //0-6的选择，指定弹出图片动画类型，默认随机
  anim: 5,
});

bug

点击第一次不奏效，第二次点击出现了图片全宽显示在浏览器中。

结果是无法在正常缩放状态显示完整图片。

纠结寻找解决办法

还是选择使用 layer.open

将图片url渲染到弹框content中，调整最大高度，就解决了需求。

layer.open({
  type: 1,
  skin: 'ayui-layer-nobg',
  maxHeight: 960,
  closeBtn: 0,
  title: false,
  shadeClose: true, //开启遮罩关闭
  content: '<img style="height: 100%" src="' + $('#img_' + id +'').attr('src') + '" />'
});