jquery - 如何在页面加载时运行 Logo

Question

你用过hotmail.com吗？ 登录后，您可以看到 outlook Logo 和加载栏，完成后消失。

我正在尝试做同样的事情。

$(document).ready(function(){
    $(".loadingDiv").show();
}

.loadingDiv{ width:100%; height:100% }

但是一旦 Logo 完全动画化，我就无法理解何时隐藏它。

loadingDiv 有一个显示我的网站 Logo 动画的 gif。

Answer 1

这对你有用

var $preLoader = $(".main-loader");
$(window).load(function() {
    $preLoader.fadeOut(""); // Animate loader off screen
});

.main-loader {
  position: fixed;
  left: 0px;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: url(http://www.downgraf.com/wp-content/uploads/2014/09/01-progress.gif) center no-repeat white;
  background-size:50px;
}

<div class="main-loader"></div>