Question

我希望按照代码顺序淡化具有某个类的div，每个淡入淡出可能会在最后一个之后250毫秒，给人一种渐变页面加载的印象。

我立刻就褪色了......

$(window).load(function(){ 
   $('div.fade_this_please').fadeIn(4000);
});

但是我不知道我将在每个DIV中循环并在另一个完成时淡入它。

有人能指出我正确的方向吗？

任何建议表示赞赏！

Answer 1

这会使所有div进入视图，每个div都有250ms的延迟。我建议每次最多将淡入淡出时间减少到2秒，4秒似乎太长，可能会让人烦恼; - ）

$(window).load(function() {
   $('div').each(function(i) {
      $(this).delay((i + 1) * 250).fadeIn(2000);
   });
});

Answer 2

您可以迭代它们并在fadeIn()：

之前设置延迟

$(window).load(function(){
   var delay = 0;
   $('div.fade_this_please').each(function(){
      $(this).delay(delay).fadeIn(4000);
      delay += 250;
   });
});

Answer 3

尝试

$('div.fade_this_please').fadeIn(4000).delay(250);

或

jQuery(function($){
var e = $('div.fade_this_please'); 
e.fadeIn(); 
e.queue(function(){ 
  setTimeout(function(){ 
    e.dequeue(); 
  }, 250 ); 
}); 
});

reference

在窗口加载时逐渐淡化元素

3 个答案: