鼠标滚轮调整图片大小

发布时间：2020-08-05 14:07:56 作者：pannijingling
来源：网络阅读：456

=======粘贴以下代码,保存为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>

鼠标滚轮调整图片大小

=======粘贴以下代码,保存为html文件可直接运行查看效果=======

相关阅读