自己写的一个非常简单的图片微缩JS代码,当然网上有很多类似的代码,在此确实是献丑了。 主要方法写在SetImgSize.js里面 SetImgSize.js 1 //智能微缩图片JS方法 2 //参数:imgID(图片的标识ID) 3 //参数:maxWidth(图片的最大宽度,值为0则表示不限制宽度) 4 //参数:maxHeight(图片的最大高度,值为0则表示不限制高度) 5 function setImgSize(imgID,maxWidth,maxHeight) 6 { 7 var img = document.images[imgID]; 8 if(maxWidth < 1) 9 { 10 if(img.height > maxHeight) 11 { 12 img.height = maxHeight; 13 } 14 return true; 15 } 16 if(maxHeight < 1) 17 { 18 if(img.width > maxWidth) 19 { 20 img.width = maxWidth; 21 } 22 return true; 23 } 24 if(img.height > maxHeight || img.width > maxWidth) 情缘.教程_网 [http://Www.XiuGoo.Com] 25 { 26 if((img.height / maxHeight) > (img.width / maxWidth)) 27 { 28 img.height = maxHeight; 29 } 30 else 31 { 32 img.width = maxWidth; 33 } 34 return true; 35 } 36 } 功能实现原理是在图片加载完毕后(onload事件)用JS实现微缩。 下面是一个测试用的文件test.htm test.htm 1 2 3 4 5 6 7 8 限定了宽度150px 9 10 限定了高度150px 11 12 限定了高度150px、宽度150px 13 14 15 就写到这里了,呵呵,是不是很简单啊! |
|小黑屋|最新主题|手机版|微赢网络技术论坛 ( 苏ICP备08020429号 )
GMT+8, 2024-9-29 17:32 , Processed in 0.198216 second(s), 12 queries , Gzip On, MemCache On.
Powered by Discuz! X3.5
© 2001-2023 Discuz! Team.