jQuery滑过LIs

Question

我有一个很长的LId列表从屏幕流出来，我希望它能让我点击上一个和下一个按钮，幻灯片沿着一个方向移动，无论点击哪个方向。我最好喜欢它循环，如果可能的话我想远离插件。

我知道我需要marginLeft来增加它的值，但我不知道该怎么做。任何帮助将不胜感激。谢谢！

<ul>
   <li class="first selected team_one"></li>
   <li class="team_two"></li>
   <li class="team_three"></li>
   <li class="team_four"></li>
   <li class="last team_five"></li>
</ul>

$('.team .next').click(function(){
   $('.team ul li.first').animate({ marginLeft: '-157px' });
});

$('.team .prev').click(function(){              
   $('.team ul li.first').animate({ marginLeft: '0' });
}); 

Answer 1

Wel的想法是，这是一个彼此相邻的元素列表，在一个带溢出的div：hidden。然后你只需要动画左边或边距等使其转到下一个图像，我使用的是css3过渡到动画的动画。

您可以使用几秒钟的setTimeout（）执行一个函数，然后在内部增加margin或left（作为pmandell的注释），在增加之后再次调用函数，并且可以放在顶部a如果左边或边距高于x的声明，则代替增量，再次设置初始值。您还可以定义一个布尔值，并在布尔值更改时停止动画，作为计数器或类似的东西。

希望它对你有所帮助。