用JS自动缩小超出大小的图片

在文章的正文中,往往会出现一些超大的图片,把页面撑开变形,影响了美观。用这段JS代码就可解决这个问题,你可以把图片的最大值限定在一定范围内,当图片大小超出这个尺寸后,就会被自动缩小。

<SCRIPT src="/js/ShowPic.js" type=text/javascript></SCRIPT>
<script  language="JavaScript"> 
<!-- 
var  flag=false; 
function  DrawImage(ImgD){ 
     var  image=new  Image(); 
     image.src=ImgD.src; 
     if(image.width>0  &&  image.height>0){ 
       flag=true; 
       if(image.width/image.height>=  200/200){ 
         if(image.width>200){     
         ImgD.width=200; 
         ImgD.height=(image.height*200)/image.width; 
         }else{ 
         ImgD.width=image.width;     
         ImgD.height=image.height; 
         } 
        
         } 
       else{ 
         if(image.height>200){     
         ImgD.height=200; 
         ImgD.width=(image.width*200)/image.height;           
         }else{ 
         ImgD.width=image.width;     
         ImgD.height=image.height; 
         } 
        
         } 
       } 
}   
//--> 
</script>

把上边的这段代码加入<head></head>之中
在相关图片上加入以下代码或者把onload的代码加入到body里:

<img src=# onload=javascript:DrawImage(this); >

原文地址:https://www.cnblogs.com/zgz_dpl/p/1876668.html