javascript - 即使 slider 的元素结束，如何使 slider 继续循环(如何包装 slider )？

Question

我使用 css 和 html 以及 jQuery 创建了一个 slider 。该 slider 与下一个按钮配合使用效果很好，但与上一个按钮配合使用效果不佳。

假设我在第一张幻灯片上有五个元素，总共有 15 个元素。所以如果我点击下一步三次，元素就会结束。在第四次单击时它应该显示前五个元素(并且效果很好)但是如果我第一次单击上一个按钮它应该显示 11-15 的最后五个元素但它不会这样做。它仍在向我显示 6-10 的下五个元素。

这个链接会解释我想说的:

http://jsfiddle.net/mpx83tpv/10/

Answer 1

这是因为 previous 按钮中的逻辑与 next 按钮中的逻辑相同，您希望它的工作方式有何不同？

我把你以前的功能改成了这个，现在可以用了，

$(".prev_button").click(function(){
    $("ul.slider").animate({
        left: "+=855"
    }, 3000, function(){
        $("ul.slider").css('left', '0');
        $('ul.slider li:gt(12)').prependTo('ul.slider'); // << line changed
    });
});

你可以在这里测试: http://jsfiddle.net/mpx83tpv/11/