JS图片等比例缩放方法完整示例
本文实例讲述了JS图片等比例缩放方法。分享给大家供大家参考,具体如下:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/> <title>javascript自动按比例显示图片,按比例压缩图片显示</title> <scripttype="text/javascript"> functionAutoResizeImage(maxWidth,maxHeight,objImg){ varimg=newImage(); img.src=objImg.src; varhRatio; varwRatio; varRatio=1; varw=img.width; varh=img.height; wRatio=maxWidth/w; hRatio=maxHeight/h; if(maxWidth==0&&maxHeight==0){ Ratio=1; }elseif(maxWidth==0){// if(hRatio<1)Ratio=hRatio; }elseif(maxHeight==0){ if(wRatio<1)Ratio=wRatio; }elseif(wRatio<1||hRatio<1){ Ratio=(wRatio<=hRatio?wRatio:hRatio); } if(Ratio<1){ w=w*Ratio; h=h*Ratio; } objImg.height=h; objImg.width=w; } </script> </head> <body> <br/> <imgsrc="1.jpg" border="0" width="0" height="0" onload="AutoResizeImage(100,0,this)" /> width:100px <br/> <br/> <imgsrc="1.jpg" border="0" width="0" height="0" onload="AutoResizeImage(0,100,this)" /> height:100px <br/> <br/> <imgsrc="1.jpg" border="0" width="0" height="0" onload="AutoResizeImage(100,100,this)" /> width:100pxheight:100px <br/> <br/> <br/> <br/> <br/> <br/> <br/> </body> </html>
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。