繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 网页中的图片的处理方法与代码
- Javascript
- IE与firefox下Dhtml的一些区别小结
- jQuery Selectors(选择器)的使用(一、基本篇)
- jQuery Selectors(选择器)的使用(二、层次篇)
- jQuery 跨域访问问题解决方法
- jquery的ajax从纯真网(cz88.net)获取IP地址对应地区名
- javascript 面向对象全新理练之数据的封装
- javascript 面向对象全新理练之继承与多态
- javascript 面向对象全新理练之原型继承
- JavaScript 生成随机数并自动大小排序
- JavaScript利用split函数按规定截取字符串(获取邮箱用户名)
- JavaScript 双级下拉菜单实现代码
- JavaScript split()使用方法与示例
- 33种Javascript 表格排序控件收集
- js 屏蔽鼠标右键脚本附破解方法
- javascript json 新手入门文档
- jQuery Selectors(选择器)的使用(四-五、内容篇&可见性篇)
- javascript KeyDown、KeyPress和KeyUp事件的区别与联系
- javascript 汉字转拼音实现代码
- javascript 跳转代码集合
- JavaScript 申明函数的三种方法 每个函数就是一个对象（一）
Javascript 中的 网页中的图片的处理方法与代码
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2010-01-10 浏览: 61 ::
收藏到网摘: n/a
昨天的一篇 图片的alt属性 文章评论中的启发，特将网页中的图片的一些处理方法 小小的总结一下 1 掉链接的图片处理
<img src="no.jpg" onerror="this.src='images/new.gif'">
2 自动缩小大图
经常看到一些图片很大，上传后显示会撑满屏幕。下面的例子通过检测图片的宽度，如果该图片的宽度大于“屏幕宽度-350”，
则让该图就显示“屏幕宽度-350”这么大小。
原图
<img src="jsimg/wallpaper.jpg">
设定大小的图
<img src="jsimg/wallpaper.jpg" onload="javascript:if(this.width>screen.width-350) this.width=screen.width-350">
3 禁止IE6中大尺寸图片的自动缩小
原图,会自动缩小
<img src="jsimg/wallpaper.jpg">
设定不缩小
<img src="jsimg/wallpaper.jpg" galleryimg="no">
4 去掉热点地图上的区域线框与超链接的线框
复制代码 代码如下:
<a href="#" onFocus=this.blur()> <img src="jsimg/marylin.jpg" border=0> </a>
5 可控制上传图片的大小
处理上传图片大小的JS
复制代码 代码如下:
<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>
评论 (0) All
