javascript

位置:IT落伍者 >> javascript >> 浏览文章

用JavaScript自动生成等比例所略图


发布日期:2023年12月31日
 
用JavaScript自动生成等比例所略图
<!

本示例演示图片加载时自动显示等比例缩略图在做web程序的时候往往会遇到客户上传很大的图片但是显示的时候如果把所略图的高宽比手工设置好由于图片的形状不同会造成显示变形这里用一段小脚本程序来解决这个问题你可以把它修改一下做的更通用一些比如说把Wa_SetImgAutoSize()函数加个img参数然后在图片的onload=事件里传送自己去调用函数

>

<HTML>

<HEAD>

<TITLE>演示图片等比例缩小</TITLE>

<script>

function Wa_SetImgAutoSize()

{

var img=documentallimg;//获取图片

var MaxWidth=;//设置图片宽度界限

var MaxHeight=;//设置图片高度界限

var HeightWidth=imgoffsetHeight/imgoffsetWidth;//设置高宽比

var WidthHeight=imgoffsetWidth/imgoffsetHeight;//设置宽高比

if(imgreadyState!=complete)return false;//确保图片完全加载

if(imgoffsetWidth>MaxWidth){

imgwidth=MaxWidth;

imgheight=MaxWidth*HeightWidth;

}

if(imgoffsetHeight>MaxHeight){

imgheight=MaxHeight;

imgwidth=MaxHeight*WidthHeight;

}

}

</script>

</HEAD>

<BODY>

<img src= border= id=img onload=Wa_SetImgAutoSize();>

<br>

<input id=inp type=file onpropertychange=imgsrc=thisvalue;>

</BODY>

</HTML>

上一篇:JavaScript对象与数组参考大全2

下一篇:JScript运算符