Layui点击图片弹框预览的实现方法

我就废话不多说了,直接上代码吧!

如下所示:

<img src="https://www.jb51.net/123.png">

function previewImg(obj) { var img = new Image(); img.src = obj.src; //var height = img.height + 50; // 原图片大小 //var width = img.width; //原图片大小 var imgHtml = "<img src='" + obj.src + "'/>"; //弹出层 layer.open({ type: 1, shade: 0.8, offset: 'auto', area: [500 + 'px',550+'px'], // area: [width + 'px',height+'px'] //原图显示 shadeClose:true, scrollbar: false, title: "图片预览", //不显示标题 content: imgHtml, //捕获的元素,注意:最好该指定的元素要存放在body最外层,否则可能被其它的相对元素所影响 cancel: function () { //layer.msg('捕获就是从页面已经存在的元素上,包裹layer的结构', { time: 5000, icon: 6 }); } }); }

//另外打开一个页面显示图片 function previewImg(obj) { window.open(obj.src); }

以上这篇Layui点击图片弹框预览的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/6e4d638d01bb4c7d28ababccd7ad280d.html