通过JS简单实现图片缩放

#ShowBigImgDiv{position: absolute;z-index: 10001;display: none;cursor: pointer;}
#FullScreenDiv{position: absolute;z-index: 10000;display: none;background-color: #919191;filter: alpha(opacity=50);opacity: 0.5; cursor: pointer;}

<div id="FullScreenDiv" onclick="BackFullScreenHidde()" title="点击缩小"></div>
<div id="ShowBigImgDiv" onclick="BackFullScreenHidde()" title="点击缩小"></div><img onclick="BackFullScreen(this.src)" id="pic" alt="身份证" src="<%=rootpath%>/User/tocardimg?code=${user.f16}" height="100px" width="200px">
                

function BackFullScreen() {
    var BigImgUrl = document.getElementById("pic").getAttribute("src");
    var FullScreenDiv = document.getElementById("FullScreenDiv");
    FullScreenDiv.style.width = document.body.clientWidth + "px";
    FullScreenDiv.style.height = document.body.clientHeight + "px";
    FullScreenDiv.style.display = "block";
    var ShowBigImgDiv = document.getElementById("ShowBigImgDiv");
    var ShowBigImgDivPosition;
    ShowBigImgDiv.style.display = "block";
    ShowBigImgDiv.innerHTML = "<img src=\"" + BigImgUrl + "\" width=\"500\" height=\"400\"  border=\"0\" />";
    ShowBigImgDivPosition = document.documentElement.scrollTop;
    if (ShowBigImgDivPosition == 0 || ShowBigImgDivPosition == "") {
        ShowBigImgDivPosition = document.body.scrollTop;
    }
    ShowBigImgDiv.style.top = ShowBigImgDivPosition + ((window.screen.height - ShowBigImgDiv.clientHeight) / 2 - 170 ) + "px";
    ShowBigImgDiv.style.left = (window.screen.width - ShowBigImgDiv.clientWidth) / 2 - 90 + "px";

}
function BackFullScreenHidde() {
    document.getElementById("ShowBigImgDiv").style.display = "none";
    document.getElementById("FullScreenDiv").style.display = "none";
}