jQuery同步操作

Question

我逐渐淡化元素，但它似乎一下子全部消失。

如何逐个淡化元素。只有一个人完全消失，第二个人才会开始消失。

我环路和褪色像这样

$(ele).fadeIn('slow'); 

Answer 1

我制作了这个快速/简单的jQuery插件，可以让您按照自己的意愿进行操作。 :-)

$.fn.extend({ 
    serial_fade: function(o) { 
     if(!o.speed || o.speed == undefined || o.speed == null) { o.speed = 'slow'; } 
     if(!o.fade || o.fade == undefined || o.fade == null) { o.fade = 'in'; } 
     if(!o.index || o.index == undefined || o.index == null) { o.index = 0; } 
     var s = this.selector; 
     if(o.fade.toLowerCase() == 'in') { 
      return this.eq(o.index).fadeIn(o.speed, function() { 
       o.index++; 
       if($(s).eq(o.index).length > 0) { 
        $(s).serial_fade({speed:o.speed,fade:o.fade,index:o.index}); 
       } 
      }); 
     } else { 
      return this.eq(o.index).fadeOut(o.speed, function() { 
       o.index++; 
       if($(s).eq(o.index).length > 0) { 
        $(s).serial_fade({speed:o.speed,fade:o.fade,index:o.index}); 
       } 
      }); 
     } 
    } 
}); 

// To call it just do this: 
$(ele).serial_fade({speed:'slow',fade:'in'}); 

// Optionally, you can pass which element you want to start with (0-based): 
$('a').serial_fade({speed:'slow',fade:'in',index:2}); 

// If you want to start with element 2 (3, really) and fade all the rest *out* 
// sequentially, verrry slowly: 
$(ele).serial_fade({speed:5000,fade:'out',index:2}); 

它应该像任何其他jQuery方法一样使用任何类型的选择器。我希望这能为你解决。

编辑：我延长，以便它可以做淡入和褪色出局了。它似乎更有用的方式...

Answer 2

淡入有完成衰落时执行的回调。添加到elemX类的每个元素，其中x是衰落的顺序。然后使用下面的代码：

startFading(1); 

function startFading(order) { 
    $(".ele" + order).fadeIn('slow', function() { 
     if (order < orderMax) { 
      startFading(order+1); 
     } 
    }); 
} 

Answer 3

你可以使这个通用的，而不是强迫它只是为了淡化。

function depth(collection, fun, i) { 
    if (i === undefined) 
     depth(collection, fun, 0); 
    else 
     if (i < collection.length) 
      fun(collection[i], function(){ 
       depth(collection, fun, i + 1); 
      }); 
}; 

depth($("a"), function(elem, fun) { 
    $(elem).fadeIn('slow', fun); 
});