与加载页面
来源:互联网 发布:自然语言算法有哪些 编辑:程序博客网 时间:2024/06/04 18:46
<html>
<head>
<style type="text/css">
div{border:#aaaaaa 3px solid;width:200px;padding:2px;margin:2px 9px;font-size:12px;line-height:22px;color:#999999;}
.ipt1{width:160px;font-size:12px;color:#1F6478;border:#999999 1px solid;margin-left:9px;}
.ipt2{border:#999999 1px solid;margin-left:6px;color:#666666}
p{margin:0px;padding:0px;background-image:url(http://www.codefans.net/jscss/demoimg/loading.gif);background-position:center;background-repeat:no-repeat;width:200px;height:200px;text-align:center;font-size:12px;color:#999999;line-height:26px;}
</style>
<script language="javascript" type="text/javascript">
function preloadimg(url,obj,ipt){
var img=new Image();
obj.innerHTML="<p>图片加载中...</p>";
img.onload=function(){obj.innerHTML="";obj.style.width=String(img.width)+"px";ipt.style.width=String(img.width-40)+"px";obj.appendChild(img);};
img.onerror=function(){obj.innerHTML="图片加载失败!"};
img.src=url; //img.src一定要写在img.onload之后,否则在IE中会出现问题
}
function show(){
var div=document.getElementsByTagName("div")[0];
var input=document.getElementsByTagName("input");
preloadimg("http://www.codefans.net/jscss/demoimg/wall8.jpg",div,input[0]);
input[0].onclick=function(){this.value=""};
input[1].onclick=function(){preloadimg(input[0].value,div,input[0]);}
}
window.onload=show;
</script>
<title>JavaScript图片预加载代码,显示loading</title>
</head>
<body>
<div></div>
<br />
<input type="text" value="将图片地址粘贴在这里" class="ipt1"/><input type="button" value="开始加载" class="ipt2"/>
</body>
</html>
- 与加载页面
- js与页面加载
- ADF页面加载与刷新
- JS执行与页面加载
- 页面的加载与渲染
- 浏览器的加载与页面性能优化
- javascript页面加载与事件监听函数
- 浏览器的加载与页面性能优化
- 浏览器的加载与页面性能优化
- 浏览器的加载与页面性能优化
- 浏览器的加载与页面性能优化
- 页面的加载与渲染顺序
- 浏览器的加载与页面性能优化
- 浏览器的加载与页面性能优化
- 浏览器的加载与页面性能优化
- 浏览器的加载与页面性能优化
- 浏览器的加载与页面性能优化
- 浏览器的加载与页面性能优化
- WINCE6 不能显示中文的问题,中文乱码,原因:选择了Raster Fonts Support(SYSGEN_GDI_RASTERFONT)
- 传智播客课程——JavaScript
- MFC技巧积累
- java相关
- c#绘制验证码
- 与加载页面
- JDBC连接MySQL数据库关键的四个步骤
- C#中Thread种中Join步骤的了解
- ubuntu 9.10 english 环境下安装中文输入法
- ORACLE和SQL语法区别归纳
- 关于天翼3G网卡DATA interface驱动无法加载的问题
- 利用QTP在WEB应用程序上进行简单的猴子测试
- powerdesigner设置集锦
- oracle 权限