layui后台查看图片
super
2020-11-26 13:46
3539
function previewImg(obj) { var img = new Image(); img.src = obj.src; var height = img.height; //获取图片高度 var width = img.width; //获取图片宽度 if (height > 1000 || width > 800) { height = height / 2; width = width / 2; } var imgHtml = "<img src='" + obj.src + "' style='width: " + width + "px;height:" + height + "px'/>"; //弹出层 layer.open({ type: 1, //shade: 0.8, // 遮罩层 offset: 'auto', area: [width + 'px',height + 'px'], shadeClose:true,//点击外围关闭弹窗 scrollbar: false,//不现实滚动条 title: false, //不显示标题 content: imgHtml, //捕获的元素,注意:最好该指定的元素要存放在body最外层,否则可能被其它的相对元素所影响 cancel: function () { //layer.msg('捕获就是从页面已经存在的元素上,包裹layer的结构', { time: 5000, icon: 6 }); } }); }
<img src="/static/img.jpg" alt="" style="height: 45px;" onclick="previewImg(this)">
效果(此图片为1920*1080):
0 条讨论