keiite 发表于 2013-2-7 20:03:48

利用javascript实现图片等比例缩放

解决了我很苦恼的图片走形问题
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    <html xmlns="http://www.w3.org/1999/xhtml">    <head>   <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />   <title>图片等比例绽放</title>   </head>   <body>   <img src="zz.gif" id="Image1"/></body>   </html>   <script language="javascript" type="text/javascript">    function DrawImage()    {      var FitWidth = 200,FitHeight = 200;       var ImgD = document.getElementById('Image1');       var image = new Image();      image.src=ImgD.src;      if(image.width>0 && image.height>0)      {            if(image.width/image.height>= FitWidth/FitHeight)            {                if(image.width>FitWidth)                {                   ImgD.width=FitWidth;                  ImgD.height=(image.height*FitWidth)/image.width;                }               else               {                  ImgD.width=image.width;                   ImgD.height=image.height;                }            }            else         {               if(image.height>FitHeight)               {                   ImgD.height=FitHeight;                  ImgD.width=(image.width*FitHeight)/image.height;               }               else               {                  ImgD.width=image.width;                   ImgD.height=image.height;               }            }      }    }         DrawImage();   </script> 
页: [1]
查看完整版本: 利用javascript实现图片等比例缩放