我一直在网站上工作,最近我决定对我的网站实施预加载器。我已经准备就绪,但是控制加载程序的JavaScript似乎无法正常工作。
这是我的代码:
由于有很多代码,我已经将其上传到JSFiddle这里是https://jsfiddle.net/mvc2fe1a/1/
<div class="spinner-wrapper">
<div class="spinner">
<svg width="634" height="62" viewBox="0 0 634 62" fill="none" xmlns="http://www.w3.org/2000/svg">
...
</svg>
</div>
</div>
.spinner-wrapper {
height: 100%;
width: 100%;
background: #333;
position: absolute;
top: 0;
left: 0;
}
.spinner {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
function loadPage() {
let timeout = setTimeout(showPage, 3000);
}
function showPage() {
document.querySelector('.spinner-wrapper').style.display = 'none'
document.querySelector('.container').style.display = 'block'
}
但是此代码不起作用,我在做什么错?
您需要调用loadPage
函数。现在,您只定义了它。
// other code
loadPage();
您忘了调用loadPage()
功能
我编辑了您的小提琴:https://jsfiddle.net/woma7h83/