layui实现一个图片点击放大

2019-10-26 17:58:45  卢浮宫  版权声明:本文为站长原创文章,转载请写明出处


一、背景

    业务需求,实现一个图片点击放大功能。之前有说个一个写div,遮罩层的思路(可以参考之前的文章)


二、解决方案

    因为整体使用的是layui,所以就考虑使用layui本身实现其功能。网上查了相关资料,然后这里记录下


三、直接贴代码吧


    layer.open({

type: 1,
title: false,
closeBtn: 0,//隐藏关闭按钮
shade: [0.3, '#000'],//黑色背景(0.3代表颜色深度)
shadeClose: true,//点击遮罩关闭大图
area: [700 + 'px', 700 + 'px'], //宽高
resize:false,//不可拖拽缩放
skin: 'myskin',//大图背景色定义类
content: "<img alt=" + "" + " title=" + "" + " src='" + url + "'/>"
});





更多精彩请关注guangmuhua.com


最新评论: