Layer完成图片放大功能

2020-04-09 22:48发布

 HTML代码

<a href="javascript:DataHtml('无标题2.jpg','/UploadFiles/VendorNo/PUR000001/78b65e62-cb56-49eb-9cc2-591376f4cdf4.jpeg')">
  <img alt='无标题2.jpg' title='无标题2.jpg' style='width:100px' src='/UploadFiles/VendorNo/PUR000001/78b65e62-cb56-49eb-9cc2-591376f4cdf4.jpeg'/>
</a>
<a href="javascript:DataHtml('无标题.jpg','/UploadFiles/VendorNo/PUR000001/a55c127f-b6be-4455-a576-f0ca033a116e.jpeg')">
  <img alt='无标题.jpg' title='无标题.jpg' style='width:100px' src='/UploadFiles/VendorNo/PUR000001/a55c127f-b6be-4455-a576-f0ca033a116e.jpeg'/>
</a>
<img alt="" style="display:none" id="displayimg" src="" />

 JS代码方法

function DataHtml(name, url) {
                $("#displayimg").attr("src", url);
                var height = $("#displayimg").height();
                var width = $("#displayimg").width();
                layer.open({
                    type: 1,
                    title: false,
                    closeBtn: 0,
                    shadeClose: true,
                    area: [width + 'px', height + 'px'], //宽高
                    content: "<img alt=" + name + " title=" + name + " src=" + url + " />"
                });
}

 

标签: