制作页面屏蔽层

html部分:

<!--屏蔽层,用来透明的屏蔽整个页面-->
<div id="mapBgLayer" style="position:absolute; display: none;">
<img src="${pageContext.request.contextPath}/common/images/loading1.gif">
</div>

css部分:
<style type="text/css">
#mapBgLayer {
background: #939393 none repeat scroll 0 0;
height:100%;
width:100%;
left:0;
top:0;
filter:alpha(Opacity=30);-moz-opacity:0.1;opacity: 0.1;
z-index: 9999;
text-align:center;
}
#mapBgLayer img {
position: absolute;
top:50%;
transform: translate(0,-50%);
z-index: 10000;
}
</style>

js部分:
//打开屏蔽层
function showDiv(){
var bg = document.getElementById("mapBgLayer");
var w = document.body.scrollWidth; //网页正文全文宽
var h = document.body.scrollHeight; //网页正文全文高
bg.style.display = "";
bg.style.width = w + "px";
bg.style.height = h + "px";

}
//关闭屏蔽层
function closeDiv(){
$("#mapBgLayer").hide();
}

posted @ 2018-08-09 09:45  大鹰  阅读(205)  评论(0编辑  收藏  举报