在网上找了很久,这里保存一下,方便以后使用
实现思路很简单,改造js代码,既然图片很大,那么我们先用最经典的限制width的方法限制大图的宽度,但是小图怎么办?小图我们用onload的方法再缩小,就这么搞定了。完美代码如下:
对应的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>650){
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
}
//-->
</script>
对应的HTML代码:
<img border=0 src="图片路径" onload="javascript:DrawImage(this);" width="650" />
本文介绍了一种通过JavaScript实现图片自适应加载的方法。该方法能够确保图片在不同尺寸下都能正常显示,对于大图采用限制宽度的方式,而对于小图则通过onload事件进行缩放。
1396

被折叠的 条评论
为什么被折叠?



