我在我的个人网站上制作了一个加载屏幕。当我进入网站时,我发现页脚会覆盖我的加载屏幕。
我希望在我进入网站时我的加载屏幕可以覆盖整个屏幕。我该怎么做?
这是我的代码,css 和 js。
<footer class="cfooter navbar-fixed-bottom text-center" id="cfooter">
<div class="container">
<div class="row">
<div class="col-lg-12"> </div>
</div>
<div class="row">
<div class="col-lg-12"> </div>
</div>
<div class="row">
<div class="col-lg-4"></div>
<div class="col-lg-4">Powered by <a href="https://www.test.com/" target="_blank">User</a></div>
<div class="col-lg-4"></div>
</div>
<div class="row">
<div class="col-lg-12"> </div>
</div>
<div class="row">
<div class="col-lg-12"> </div>
</div>
</div>
</footer>
#cfooter {
display: block;
border: 1px solid 000000;
height: 100px;
text-align: center;
background-color: #000000;
color: #fff;
font-size: 15px;
}
div.load_screen {
position:fixed;
width: 100%;
height: 100%;
background: white;
}
img.load_screen {
z-index: 9999999;
position: fixed;
left: 50%;
top: 50%;
margin: -27px 0 0 -95px; /* -image-height/2 0 0 -image-width/2 */
background: white;
}
$(function() {
$("div.load_screen").fadeIn("slow")
setTimeout(function() {
$("div.load_screen").fadeOut("slow")
}, 3000);
})
最佳答案
将 z-index: 999;
添加到 div.load_screen
关于javascript - 加载屏幕被页脚覆盖,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45914732/