Question

我有一个列表，我希望通过每个LI淡入淡出，并显示下一个li之间的延迟。我觉得我应该能够遍历List，但我没有让它循环。有索引的东西？

$('#content li').hide();
$('#content li').each(function(n){
$(this).delay().fadeIn('li').delay().fadeOut();
//how to I start over in the LI again? keep looping?
}

感谢您的任何想法，想法和/或帮助！我很感激。

Answer 1

您的代码存在一些问题

fadeIn可以作为参数持续时间，缓和和回调功能

所以传递li没有做任何事情......

您可以使用回调来启动下一行li的动画..

喜欢这样

function InOut( elem )
{
 elem.delay()
     .fadeIn()
     .delay()
     .fadeOut( 
               function(){ InOut( elem.next() ); }
             );
}

并且第一次做

$('#content li').hide();
InOut( $('#content li:first') );

http://www.jsfiddle.net/gaby/S5Cjm/

演示

如果您希望循环继续循环，请将fadeOut的回调更改为

.fadeOut(
          function(){
             if(elem.next().length > 0) // if there is a next element
               {InOut( elem.next() );} // use it
             else
               {InOut( elem.siblings(':first'));} // if not, then use go back to the first sibling

           }
         );

http://www.jsfiddle.net/gaby/S5Cjm/1/

演示

jQuery Fade In LI item，淡出和延迟（）;下一个LI，淡入，淡出

1 个答案: