首页 > 其他 > 详细

鼠标滚轮改变图片大小

时间:2015-01-08 13:13:45      阅读:156      评论:0      收藏:0      [点我收藏+]
    <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>

 

鼠标滚轮改变图片大小

原文:http://www.cnblogs.com/wjshan0808/p/4210531.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!