标题 | js 自适应控制图片的大小 |
范文 | <script language="javascript"> var flag=false; function DrawImage(ImgD){ var image=new Image(); image.src=ImgD.src; if(image.width>0 && image.height>0){ flag=true; if(image.width/image.height>=500/400){ if(image.width>500){ ImgD.width=500; ImgD.height=(image.height*500)/image.width; }else{ ImgD.width=image.width; ImgD.height=image.height; } } else{ if(image.height>400){ ImgD.height=400; ImgD.width=(image.width*400)/image.height; }else{ ImgD.width=image.width; ImgD.height=image.height; } } } } </script> 调用方式(img是显示图片的html代 ) <IMG src= "temp.jpg" border=0 onload="javascript:DrawImage(this);"> 修改后: <script language="javascript"> var flag=false; //控制小图 function DrawImage(ImgD,maxwidth,maxheight){ var image=new Image(); image.src=ImgD.src; if(image.width>0 && image.height>0){ flag=true; if(image.width/image.height>=maxwidth/maxheight){ if(image.width>maxwidth){ ImgD.width=maxwidth; ImgD.height=(image.height*maxwidth)/image.width; }else{ ImgD.width=image.width; ImgD.height=image.height; } } else{ if(image.height>maxheight){ ImgD.height=maxheight; ImgD.width=(image.width*maxheight)/image.height; }else{ ImgD.width=image.width; ImgD.height=image.height; } } } } </script> 呵呵,多了两个参数,也就是你能够接受的最大宽度maxwidth与最大高度maxheight |
随便看 |
|
在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板,是学习及工作的有利工具。