动态改变图片大小来适应页面（转）

 

在网页中，如果一张图片大小超过图片容器页面元素大小，就会将页面撑得很难看。下面这段代码可以解决这个问题：

function picresize ( obj , MaxWidth , MaxHeight ){
     obj . onload = null ;
     img = new Image () ;
     img . src = obj . src ;
     if ( img . width > MaxWidth && img . height > MaxHeight ){
         if ( img . width / img.height>MaxWidth / MaxHeight ) {
             obj . height = MaxWidth * img . height / img.width;
              obj.width=MaxWidth;
          }else {
              obj.width=MaxHeight*img.width /i mg . height ;
             obj . height = MaxHeight ;
         }
     } else if ( img . width > MaxWidth ) {
         obj . height = MaxWidth * img . height / img.width;
          obj.width=MaxWidth;
      }else if (img.height>MaxHeight) {
          obj.width=MaxHeight*img.width /i mg . height ;
         obj . height = MaxHeight ;
     } else {
         obj . width = img . width ;
         obj . height = img . height ;
     }
}

用法举例：

< img src = " http://php.4like.net/wp-content/themes/pg/images/logo.gif " onload = " picsize(this, 100,50); " />

程序分析：

1、如果图片的宽度和高度都比预设值大，并且图片的宽高比例比预设值的宽高比例大，就把图片的宽度置为预设值的宽度，高度置为 预设值宽度与图片高宽比例的乘积。
2、如果图片的宽度和高度都比预设值大，并且图片的宽高比例比预设值的宽高比例小或者相等，就把图片的高度置为预设值的高度，宽度置为 预设值高度与图片宽高比例的乘积。
3、如果图片的宽度大于预设值而高度小于等于预设值，就把图片的宽度置为预设值的宽度，高度置为 预设值宽度与图片高宽比例的乘积。
4、如果图片的高度大于预设值而宽度小于等于预设值，就把图片的高度置为预设值的高度，宽度置为 预设值高度与图片宽高比例的乘积。
5、如果图片的宽度和高度都比预设值小，就采用图片的原始大小。
6、经过上面的大小调整后，宽度和高度都比预设值小的图片，就采用图片的原始大小，其他大小均成比例缩放图片。