首页 > 其他 > 详细

鼠标滚轮调整图片大小

时间:2018-08-08 17:25:08      阅读:171      评论:0      收藏:0      [点我收藏+]
=======粘贴以下代码,保存为html文件可直接运行查看效果=======
<html>
 <head> 
    <title>鼠标滚动调整图片大小</title> 
    <script language="javascript">
    <!--
        var count = 10;
        function resizeimg(oImage)
        {
        count = Counting(count);
        Resize(oImage,count);
        return false;
    }

    function Counting(newzoom){
        if (event.wheelDelta >= 120)
        newzoom++;
        else if (event.wheelDelta <= -120)
            newzoom--;
        if (newzoom<2) newzoom=2; //只允许缩小到20%
        if (newzoom>50) newzoom=50; //只允许放大到500%
        return newzoom;
    }

    function Resize(oImage,newzoom){
    oImage.style.zoom = newzoom + ‘0%‘;
    count=newzoom;
    }
    -->
    </script> 
 </head> 
 <body> 
    <center> 
     <img src="图片地址" width="670" height="502" ondblclick="return Resize(this,10);return false;" onmousewheel="return resizeimg(this)" /> 
    </center>  
 </body>
</html>

鼠标滚轮调整图片大小

原文:http://blog.51cto.com/1197822/2156299

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