javascript - 后退按钮js幻灯片

Question

我不熟悉 js，我正在尝试制作一个包含带有动画的 html div 的滑块。这是我使用的js：

$(function(){
// find all slides
var slides = $('.main-slide');
// starting index
var i = 0;
// click listener
$('#main-slider-next').click(function(){
// find next index
// i + 1 or 0 if end of slides
i = ++i % slides.length;
// scroll to that index
$('.slider-wrapper').animate(
  {'left' : -(slides.eq(i).position().left)},
  1000
);
});
});

该代码包含下一张幻灯片按钮，但我想知道如何使用 js 制作上一张幻灯片按钮。有谁知道我怎么能做到这一点？

Answer 1

很容易。尝试：

$('#main-slider-previous').click(function() {
    $('.slider-wrapper').animate({
        'left': '+=100%'
    },1000);

});

Answer 2

您总是可以使用一些简单的 jQuery 滑块，例如http://www.basic-slider.com/（或更高级的http://unslider.com/）您所要做的就是更改动画类型设置：

animtype : 'fade',

至

animtype : 'slide',

你准备好了；）。