完美实现加载转圈圈效果:
js代码:
function showLoading(show){
if(show){document.getElementById("over").style.display = "block";
document.getElementById("layout").style.display = "block";
}else{
document.getElementById("over").style.display = "none";
document.getElementById("layout").style.display = "none";
}
}
样式:
.overLoading {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #f5f5f5;
opacity:0.5;
z-index: 1000;
}
.layoutLoading {
display: none;
position: absolute;
top: 40%;
left: 40%;
width: 20%;
height: 20%;
z-index: 1001;
text-align:center;
}
html:
<div id="over" class="overLoading"></div>
<div id="layout" class="layoutLoading"><img src="${base}/resources/admin/images/loading.gif" /></div>
看懂了吗?还缺少一张图!附件下载