Layer完成图片放大功能

僤鯓⒐⒋嵵緔 提交于 2020-04-09 23:38:09

 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 + " />"
                });
}

 

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!