使用页面加载同步css动画

Question

我知道有很多像这样的问题，但没有人真正回答我的问题。 我用css动画制作了预加载器，我希望与页面加载同步。我可以在页面加载时触发动画，但我想管理动画持续时间的某个时间，以便完全按照页面加载（即使它太快）。

示例：http://jsfiddle.net/RgPU7/

我希望'填充'效果跟随页面加载时间。

现在我只是对包裹css动画的模态应用延迟和淡出效果。

jQuery(window).load(function(){
  $(".modal").delay(3000).fadeOut(1000);
});

任何建议都会很棒。谢谢！

Answer 1

您可以随时延迟这样的功能

setTimeout(function() { your_func(); }, 5000);

或者你可以做这样的事情

$(this).fadeOut(500, function(){
   //Do something 
   $(this).fadeIn(700);
});

我希望这会有所帮助。