javascript - jQuery .delay 与 .fadeOut 结合不做任何事情

Question

问题

---

我想使用 jQuery 向我的网站添加一个简单的加载动画，当我加载页面时它会出现 - 但它只是永远重复并且不会像指定的那样在 500 毫秒后淡出。

代码

---

JS Fiddle

HTML

<div class="loading">
    <img src="http://www.puzzlexperts.com/images/Preloader_3.gif" id="loader">
</div>

CSS

#loader { 
    display: block; 
    position: absolute; 
    left: 45%; 
    top: 45%; 
    z-index: 1000;
}

.loading {
position: absolute; 
    z-index: 100; 
    height: 100%; 
    width: 100%; 
    background-color: #fff;
}

JS

$(window).load(function() {
        $("#loader").delay(500).fadeOut("slow");
        $(".loading").delay(500).fadeOut("slow");
    }

它应该如何运作

---

我希望它能在纯白色全屏背景上显示加载动画 500 毫秒，然后慢慢淡出以显示网站。

你们知道如何解决这个问题吗？

Answer 1

您错过了 window.load 的右括号

$(window).load(function() {
    $("#loader").delay(500).fadeOut("slow");
});