Question

我一直在尝试使用一些jQuery轮播插件，似乎几乎所有这些插件都是通过单击放在列表左侧或右侧的箭头触发的。我想知道是否有一个列表项在点击它时一直向左摆动。

<style>
     ul {
         list-style:none;
         height:20px;
         overflow:hidden;
     }
     li {
        float:left;
     }
</style>

<ul>
    <li>First</li>
    <li>Second</li>
    <li>Third</li>
    <li>Fourth</li>
</ul>

所以，点击让我们说第四个列表项，我怎么能让它一直向左摆动，好像它现在是列表中的第一个项目。

Answer 1

我担心你的问题不清楚，但我想我会根据我认为你问的问题解决它。我已经把这个fiddle放在一起，表明了（可能有点过于字面意思）你所问的问题。我在position: relative上设置li，在第四个last设置li类。

$(".last").click(function(){
  $(this).animate({right: "125px"});
  $("li:nth-child(-n +3)").animate({left: "50px"});
});

单击后将列表项一直移动到右侧

1 个答案: