`
遐想英灵
  • 浏览: 9951 次
  • 性别: Icon_minigender_1
  • 来自: 重庆
社区版块
存档分类
最新评论

为页面添加div等待遮罩层

阅读更多
很多时候需要在前台页面提交时加上一个等待图标和遮罩。可以使用下面的例子:

<div id='loading' style='display:none;width:100%;height:120%;text-align:center;padding-top:20%; position: absolute;alpha(opacity=45); opacity:0.45;background-color:#FFFFFF;z-index:1000;'>
		<table style='margin:auto;'>
 			<tr><td><span id='disp'>提交中,请等待...</span></td></tr>
			<tr><td><img src='../某路径/img/loading.gif'></td></tr>
		</table>
	</div>


上面例子中,在页面表层添加一个div,并设置透明度来进行遮罩。
控制该遮罩层可以通过设置style.display属性来控制,如下:

// 遮罩层显示
document.getElementById("loading").style.display="block";

// 遮罩层消失
setTimeout("closeLoading()",2000);
function closeLoading() {
	document.getElementById("loading").style.display="none";
}
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics