上海益国网络科技有限公司
上海专业网站建设一条龙服务

学无止境!

这里摘有最贴近网站程序使用的方方面面相关技术文档~

021-20906540
AM 9:30-12:00 PM:2:00-5:30
您当前位置:首页 >> 技术支持 >>  技术专辑 >>  无损图片

图片等比例缩放 优化版JS

<script language="javascript" type="text/javascript">

<!--

function ImgAuto(i){//你必须给图片提前设定初始宽度和高度,建议直接就是最大宽度和高度

var MaxW=220; //定义图片显示的最大宽度

var MaxH=55; //定义图片显示的最大高度

var o=new Image();o.src=i.src;var w=o.width;var h=o.height;var t;if (w>MaxW){t=MaxW;}else{t=w;}

if ((h*t/w)>MaxH){i.height=MaxH;i.width=MaxH/h*w;}else{i.width=t;i.height=t/w*h;}

}

-->

</script>



<img src="http://www.siqiji.cn/template/siqiji/images/logo.gif" width="220" height="55"  onload="ImgAuto(this)" />



第二个:直接写入ImgAuto(this,220,55),给图片设定好宽度和高度,这样此时的宽度和高度就变成了最大宽度和高度了。更省心了

<script language="javascript" type="text/javascript">

<!--

function ImgAuto(i,MaxW,MaxH){var o=new Image();o.src=i.src;var w=o.width;var h=o.height;var t;if (w>MaxW){t=MaxW;}else{t=w;}if ((h*t/w)>MaxH){i.height=MaxH;i.width=MaxH/h*w;}else{i.width=t;i.height=t/w*h;}}

-->

</script>



<img src="http://www.siqiji.cn/template/siqiji/images/logo.gif" width="220" height="55" onload="ImgAuto(this,220,55)" >

<img src="http://www.siqiji.cn/template/siqiji/images/logo.gif" width="220" height="55" onload="ImgAuto(this,220,55)" >


做网站找动人网络!建站一条龙服务找动人网络!站长学习尽在站长培训网
  • CSS定义图片的宽高不变形处理方法
    TOP