如何让我的滑块继续其循环？

我有一个滑块从列表中建立ul包含15 li。如何让我的滑块继续其循环？

我将每个5元素显示为一个组。在和如果你点击下一个或上一个按钮，它会慢慢移动到下一个五个元素，但第三次点击后（当你点击第四次前一个时），它没有显示任何元素。我知道这很正常，因为我使用right: "+=855"来移动元素，所以在三次移动后15个元素将会结束。

我想要这个循环继续（第四次点击我想显示元素1-5的元素）。

此链接会显示我的意思： http://jsfiddle.net/mpx83tpv/1/

有没有除了animate功能，我可以添加到实现这一目标？

来源

2014-09-26 Basel Shbeb

如果我理解正确，您希望滑块环绕第一个元素，就像一个环。从你连接到的小提琴，似乎这是不可能与你的代码。但是，如果您更改代码以显示特定幻灯片，则可以将其调整为在最后一个幻灯片后面显示第一个幻灯片，并使用'if'语句确保数字回到零而不是溢出。 – mechalynx 2014-09-26 20:17:36

无则没有添加动画，可以做这样的事情，但你总是可以使用.prepend()或.append()，如：

$("ul.slider").animate({ 
    right: "+=855" 
}, 1000, function(){ 
    $("ul.slider").css('right', '0'); 
    $('ul.slider li:not(:nth-child(n+6))').appendTo('ul.slider'); 
});

Fiddle

来源

2014-09-26 20:15:00

我想感谢你它的魅力。但我希望你向我解释'n'请'n'代表什么？ – 2014-09-26 20:28:14

@BaselShbeb如果你在'第n个孩子（n + 6）'中讨论'n'，那就是第n个孩子的标准语法 – 2014-09-26 20:32:51

只是洗牌<li> s到结束滚动后：

$(".prev_button").click(function() { 
    $("ul.slider").animate({ 
     right: "+=855" 
    }, 5000, function() { 
     $("ul.slider").append($("ul.slider li:lt(5)")) 
      .css("right", "-=855"); 
    }); 
});

http://jsfiddle.net/mpx83tpv/9/

来源

2014-09-26 20:26:56

如何让我的滑块继续其循环？

回答

相关问题