鼠标滚轮改变图片大小

    <script type="text/javascript">
 
        window.onresize = function () {
            shade.style.height = document.documentElement.clientHeight + "px";
            shade.style.width = document.documentElement.clientWidth + "px";
            ImageCenter();
        } 
        function ImageCenter() {
            divDetail.style.left = (document.documentElement.clientWidth - divDetail.clientWidth) / 2 + "px";
            divDetail.style.top = (document.documentElement.clientHeight - divDetail.clientHeight) / 2 + "px";
        }

        function MakeSize(e) {
            var zoom = parseInt(e.style.zoom, 10) || 100;
            zoom += event.wheelDelta / 12;
            if (zoom > 360)
                return;
            if (zoom > 0)
                e.style.zoom = zoom + '%';
            ImageCenter();
        } 


    </script>

    <div id="Shade" style="opacity: 0.5; position: absolute; left: 0px; top: 0px; z-index: 1000;
        background: rgb(0, 0, 0);" onclick="ShadeClick();">
    </div>
    <div id="divDetail" style="zoom: 1; opacity: 1; position: absolute; z-index: 1001;">
        <img id="detailImage" onmousewheel="return MakeSize(this);" style="cursor: pointer;">
    </div>