网页中的图片的处理方法

昨天的一篇 图片的alt属性 文章评论中的启发，特将网页中的图片的一些处理方法 小小的总结一下

1 掉链接的图片处理

<img src="no.jpg" onerror="this.src='images/new.gif'">

 

2 自动缩小大图
        经常看到一些图片很大，上传后显示会撑满屏幕。下面的例子通过检测图片的宽度，如果该图片的宽度大于“屏幕宽度-350”，

则让该图就显示“屏幕宽度-350”这么大小。

     原图<br>
　　<img src="jsimg/wallpaper.jpg"><br>
　　设定大小的图<br>
　　<img src="jsimg/wallpaper.jpg" onload="javascript:if(this.width>screen.width-350) this.width=screen.width-350">

3 禁止IE6中大尺寸图片的自动缩小　　　

    原图,会自动缩小<br/>
　　<img src="jsimg/wallpaper.jpg"> <br/>
　　设定不缩小<br/>
　　<img src="jsimg/wallpaper.jpg" galleryimg="no">

 

4 去掉热点地图上的区域线框与超链接的线框

　<a href="#" onFocus=this.blur()> <img src="jsimg/marylin.jpg" border=0> </a>

 

5 可控制上传图片的大小

<script language="JavaScript">
　　function orsc(){
　　   if(img.readyState!="complete") return false;
　　   if(img.offsetWidth!=132&&img.offsetHeight!=99){
　　        alert("您选择的图片大小："+img.offsetWidth+"X"+img.offsetHeight+"\n"+"请选择132X99大小的图片")
　　        imgT=true;
　　   }
　　 　}
　　function mysubmit(theform){
　   　if(theform.file1.value==""){
　      　alert("请点击浏览按钮，选择您要上传的JPG或GIF文件!")
　　      theform.file1.focus;
　　      return (false);
　　   } else {
　　     str= theform.file1.value;
　　     strs=str.toLowerCase();
　　     lens=strs.length;
　　     extname=strs.substring(lens-4,lens);
　　    if(extname!=".jpg" && extname!=".gif"){
　　        alert("请选择JPG或GIF格式的文件!");
　　        return (false);
　　    } else {
　　       document.all("loadImg").src=theform.file1.value
　　       if(document.all("loadImg").offsetWidth!=132&&document.all("loadImg").offsetHeight!=99){
　           　alert("您选择的图片大小："+document.all("loadImg").offsetWidth+"X"+document.all("loadImg").offsetHeight+"\n"
                      +"请选择132X99大小的图片")
　         　return (false)
　       　}
　　    }
　　   }
　　}
</script>

 

<form onSubmit="return mysubmit(this)" name="form" method="post" enctype="multipart/form-data">
　　<table width="100%" border=0 cellspacing=0 cellpadding=0>
　　<tr><td valign=top height=30>
　　<input type="hidden" name="act" value="upload">
　　<input type="file" style="BORDER-TOP-WIDTH: 1px; BORDER-LEFT-WIDTH: 1px; FONT-SIZE: 12px; BORDER-BOTTOM-WIDTH: 1px; CURSOR: text; COLOR: #333333; FONT-FAMILY: "MS Shell Dlg", ","Tahoma", ","宋体"; HEIGHT: 20px; BORDER-RIGHT-WIDTH: 1px
　　" name="file1" value="">
　　<input type="submit" name="Submit" value="上传" >
　　</td>　</tr> </table>
　　<img id=loadImg>
</form>