如何使 jQuery 加载屏幕视图至少 3 秒？

Question

我刚刚使用以下代码创建了自己的加载屏幕：

HTML CODE: <div class="loader"></div>

CSS CODE: .loader {
            position: fixed;
            left: 0px;
            top: 0px;
            width: 100%;
            height: 100%;
            z-index: 9999;
            background: url(../Images/page-loader.gif) 50% 50% no-repeat rgb(249,249,249);}

jQuery CODE: <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>



AND
             $(window).load(function() {
             $(".loader").fadeOut("slow");})

每次加载页面时，加载屏幕只显示几分之一秒。我试图显示加载屏幕至少 3 秒。我应该添加什么 jQuery 代码？

Answer 1

要延迟 fadeOut 动作，您可以使用 jQuery 中的 delay() 函数 https://api.jquery.com/delay/

这将使您的淡出延迟 3 秒（3000 毫秒）。

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

Answer 2

使用setInterval

$(window).load(function() {
  setInterval(function() {
    $(".loader").fadeOut("slow")
  }, 3000);
});

如何使 jQuery 加载屏幕视图至少 3 秒？

How to make jQuery loading screen view at least 3 seconds?

javascript

jquery

animated-gif