移动端简单的遮罩层案例

一.CSS样式

#loadingBg{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:15000;display:none;}
#loadingBg img{position:absolute;top:50%;left:50%;width:33px;height:33px;margin-top:-15px;margin-left:-15px;}

<!-- 遮罩层 START -->
<div id="loadingBg" style="display: none;">
    <img src="${path}/weixin/equip/images/default/wait.gif"></img>
</div>	
<!-- 遮罩层 END -->

二.调用方法

$("#loadingBg").show();//开启遮罩层
$("#loadingBg").hide();//关闭遮罩层