页面中的图片超过规定的大小就按原图片大小缩小，不超过的就按原样的JS处理方案 选择自 WeekZero 的 Blog

2023-09-17 14:24
我们经常会遇到在页面中的图片按照我们自己的大小来显示，这样可以让页面看起来更规范一些。
比如我们要在页面种显示130×160的图片，相当于我们将图片放入这样的一个相框那，超过的就缩放到这个框的大小，小的就原样显示。
    我们这里有2种解决办法，
    1，不按照比例的缩放
< script language = " javascript " >
function  changeImg(mypic){
     var  xw = 130 ;
     var  xl = 160 ;

     var  width  =  mypic.width;
     var  height  =  mypic.height;
                    
     if  (width  >  xw ) mypic.width  =  xw;
     if  (height  >  xl ) mypic.height  =  xl;
}
script >
< img src = " sh180.jpg "  onload = " changeImg(this) " >
    2，按照比例的缩放
< script language = " javascript " >
function  changeImg1(mypic){
     var  xw = 160 ;
     var  xl = 180 ;
        
     var  width  =  mypic.width;
     var  height  =  mypic.height;
     var  bili  =  width / height;        
        
     var  A = xw / width;
     var  B = xl / height;
        
     if (A > 1 || B > 1 )
    {
         if (A < B)
        {
            mypic.width = xw;
            mypic.height = xw / bili;
        }
         if (A > B)
        {
            mypic.width = xl * bili;
            mypic.height = xl;
        }
    }
}
script >
< img src = " sh180.jpg "  onload = " changeImg(this) " >

作者Blog： http://www.nigeriaembassy.cn/WeekZero/