海南世纪云图网络科技有限公司
咨询热线:400-822-8458 客户服务:0898-32183600 无障碍阅读 适老模式

用JS自动生成等比例缩略图

发表于:2011-07-19 00:00:00来源:SOUAB.COM人气:3800

代码示例:

XML/HTML代码
  1. <html>  
  2. <head>  
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  4. <title>用JS自动生成等比例缩略图</title>  
  5. <script language="javascript">  
  6. function Wa_SetImgAutoSize()    
  7. {    
  8. var img=document.all.img1;//获取图片   
  9. var MaxWidth=300;//设置图片宽度界限   
  10. var MaxHeight=100;//设置图片高度界限   
  11. var HeightWidth=img.offsetHeight/img.offsetWidth;//设置高宽比   
  12. var WidthHeight=img.offsetWidth/img.offsetHeight;//设置宽高比   
  13. if(img.readyState!="complete")return false;//确保图片完全加载    
  14. if(img.offsetWidth>MaxWidth){   
  15.    img.width=MaxWidth;   
  16.    img.height=MaxWidth*HeightWidth;   
  17. }   
  18. if(img.offsetHeight>MaxHeight){   
  19.    img.height=MaxHeight;   
  20.    img.width=MaxHeight*WidthHeight;   
  21. }   
  22. }    
  23. </script>  
  24. </head>  
  25. <body>  
  26. <img src="图片地址" border=0 id="img1" onload="Wa_SetImgAutoSize();"/>  
  27. </body>  
  28. </html>  

 

文章整理: 世纪云图  https://www.yuntop.cc/

以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

版权申明:本站文章部份来自网络,如有侵权,请联系我们,我们收到后立即删除,谢谢!

特别注意:本站部份转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有。

微信
网站建设
软件业务
网络营销
400电话