layui.layer 预览图片自适应大小

引入layer，给图片增加一个点击事件就OK了

var src = $(this).attr("src");
lookPicture(src,1);

/**
 * layer 图片预览自适应
 * @param resourcesUrl
 * @param resourcesType 传 1 就OK了
 */
function lookPicture(resourcesUrl,resourcesType) {
    // resourcesUrl：接受的图片地址，resourcesType之前定义的数据类型（可省略）
    if (resourcesUrl == "") {
        layer.msg("没有发现图片！");
        return;
    }
    var img = new Image();
    img.onload = function () {//避免图片还未加载完成无法获取到图片的大小。
        //避免图片太大，导致弹出展示超出了网页显示访问，所以图片大于浏览器时下窗口可视区域时，进行等比例缩小。
        var max_height = $(window).height() - 100;
        var max_width = $(window).width();

        //rate1，rate2，rate3 三个比例中取最小的。
        var rate1 = max_height / img.height;
        var rate2 = max_width / img.width;
        var rate3 = 1;
        var rate = Math.min(rate1, rate2, rate3);
        //等比例缩放
        var imgHeight = img.height * rate; //获取图片高度
        var imgWidth = img.width * rate; //获取图片宽度

        var imgHtml = "<img src='" + resourcesUrl + "' width='" + imgWidth + "px' height='" + imgHeight + "px'/>";
        //弹出层
        if (resourcesType ==1 ) {
            layer.open({
                type:1,//可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                shade: 0.6,
              //  maxmin: true,
                anim: 2,
                title: false,
               // title: '图片预览',//  title: false,
                area: ['auto', 'auto'],
                // skin: 'layui-layer-nobg', //没有背景色
                shadeClose: true,
                content: imgHtml
            });
        }
    }
    img.src = resourcesUrl;
}