Question

我的代码需要一些帮助，这就是我的HTML的样子：

<body onLoad="loader();">
<div class="loader"><img src="images/loader.gif></div> 
<div class="main"></div>

CSS：

.main {
   display:none;
}

因此，显示加载Gif，然后当页面完全加载时，它应该这样做：

function loader() {
 setTimeout(function () {
    $("#main").fadeIn("fast");
    $("#loader").fadeOut("fast");
}, 1000);

};

但它所做的一切，就是装载器div消失了，然后主div显示它应该瞬间消失，然后才消失。在此先感谢您的帮助。＃：）

Answer 1

我认为你的意思是加载器在main已经淡入之后淡出，在这种情况下你需要利用回调参数。

您也可以使用delay()而不是设置超时。

您还应该使用$(document).ready()而不是在onload=""处理程序中调用该函数。

$(function(){
  $('.main').delay(1000).fadeIn('fast', function(){
    $('.loader').fadeOut('fast');
  });
});

由Blauharley注意：您的目标元素是使用main（和加载程序）的 ID ，而标记中的元素使用类。