淡入/淡出li元素有延迟

Question

除了第一个孩子，我想淡化和淡出li元素。

这是我的jQuery

$(function(){
     function fadeMyContent() {

         $("#fff li:first").fadeIn(700).delay(2000).fadeOut(700,
             function() {    
                     $(this).appendTo($(this).parent());   
                     fadeMyContent();    
             });
      }
     fadeMyContent();
});

有人可以帮我吗？

JSFIDDLE

Answer 1

如果我很好地理解了您的问题，那么我认为这可以为您提供帮助。

$(function(){
 function fadeMyContent() {
     $("#fff li").each(function(i, j){
         if($(this).text() != "first"){
     $("#fff li:first").fadeIn(700).delay(2000).fadeOut(700,
         function() {    
                 $(this).appendTo($(this).parent());   
                 fadeMyContent();    
         });
         }
     });
  }
 fadeMyContent();
});

请尝试一下，让我知道这是否是您想要的...

Answer 2

这可以计算循环次数，并允许您在第一次通过

 $(function(){
var i = 0
 function fadeMyContent() {
     if (i == 0) {

       $("#fff li:first").fadeIn(700).delay(1000).fadeOut(700,
         function() {    
                 $(this).appendTo($(this).parent());   
                 fadeMyContent();    
         });

     } else {
       $("#fff li:first").fadeIn(700).delay(2000).fadeOut(700,
         function() {    
                 $(this).appendTo($(this).parent());   
                 fadeMyContent();    
         });
     }

     i = 1
  }
 fadeMyContent();
 });

这是更新的小提琴http://jsfiddle.net/r6oth6ak/5/