jquery 实现图片放大缩小

// css 自定义鼠标样式（放大缩小图标，自己找图片即可）
.cur-large{
    cursor: url("${image}/web/image/img-enlarge.svg"),auto;
}

.cur-small{
    cursor: url("${image}/web/image/img-small.svg"),auto;
}

// htm outerdiv 遮罩层，innerdiv 放图片的div容器， bigimg imgId --------------------------------

<div id="outerdiv" style="position:fixed;top: 0;left: 0;background-color: rgba(0,0,0,0.7);z-index: 2;width: 100%;height: 100%;display: none;">
    <div id="innerdiv" style="position: absolute;left:50%;top:50%;transform: translate(-50%,-50%);">
        <img id="bigimg" src="" style="border: 3px solid white;" class="cur-small">
    </div>
</div>


// js --------------------------------

function isShow(img) {
    let $_outerdiv = $("#outerdiv"),$_innerdiv = $("#innerdiv"),$_bigimg = $("#bigimg");
    let img_src = $(img).attr("src");
    $_bigimg.attr("src",img_src);

    $("<img/>").attr("src",img_src).load(function () {
        let windowW = $(window).width();
        let windowH = $(window).height();
        //console.log("浏览器窗口 高: " + windowH + " , 宽: " + windowW);
        let imgRealW = this.width;
        let imgRealH = this.height;
        //console.log("原图片真实 高：" + imgRealH + " , 宽: " + imgRealW)
        let imgWidth,imgHeight,scale = 0.6;
        //console.log("窗口 高: " + windowH * scale + " , 宽: " + windowW * scale);
        if (imgRealH > windowH * scale) {
            imgHeight = windowH * scale;
            imgWidth = imgHeight / imgRealH * imgRealW;
            if (imgWidth > windowW * scale) {
                imgWidth = windowW * scale;
            }
        } else if (imgRealW > windowW * scale) {
            imgWidth = windowW * scale;
            imgHeight = imgWidth / imgRealW * imgRealH;
        } else {
            imgWidth = imgRealW;
            imgHeight = imgRealH;
        }
        //console.log("计算后 高：" + imgHeight + " , 宽: " + imgWidth)
        $_bigimg.css({"width":imgWidth,"imgHeight":imgHeight});
        $_outerdiv.fadeIn();
    });
    $_outerdiv.click(function () {
        $(this).fadeOut();
    })
}

// clike 触发 isShow()

<img class="cur-large" src="xxx" onclick="isShow(this)">