鼠标滚轮调整图片大小

最新推荐文章于 2021-08-26 15:39:45 发布

原创最新推荐文章于 2021-08-26 15:39:45 发布 · 604 阅读

0 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

12 篇文章

订阅专栏

<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>