基于layer的图片弹出展示,默认原大小展示。图片太大则等比例缩小

/***
  * html:<img src="img/1.jpg" onclick="showimg('img/1.jpg');">
  * 图片弹出展示,默认原大小展示。图片大于浏览器时下窗口可视区域时，进行等比例缩小。
  * src 图片路径。必须项
  * imgHeight 图片显示高度，默认原大小展示。图片大于浏览器时下窗口可视区域时，进行等比例缩小。
  * imgWidth 图片显示宽度，默认原大小展示。图片大于浏览器时下窗口可视区域时，进行等比例缩小。
  */

function showimg(src) {
    if (src || src == "") {
        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='" + src + "' width='" + imgWidth + "px' height='" + imgHeight + "px'/>";
        //弹出层
        layer.open({
            type: 1,
            title: false,//不显示标题
            closeBtn: 0,
            area: ['auto', 'auto'],
            skin: 'layui-layer-nobg', //没有背景色
            shadeClose: true,
            content: imgHtml
        });
    }
    img.src = src;
}