当前位置:首页 > 常用代码 > 正文

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

作者:不详 来源:source 【 】 浏览: 添加日期:2007-07-26 我要评论(0)     

在文章的正文中,往往会出现一些超大的图片,把页面撑开变形,影响了美观。用这段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); >

 

(如果您觉得本站不错,请告诉身边的朋友,或转载到论坛、百度知道、贴吧等,记得带网址哟,不胜感激!)

〖常用代码〗Tags: JS 缩小图片

所属专题:JS代码

更多评论(0)..会员评论

出差旅游免费预订酒店

【视频教程】新手常见问题