简单的jQuery旋转木马不能很好地工作

Question

我创建了一个简单的jQuery轮播滑块。您可以看到演示here

问题是，当我点击右键按钮就像魅力一样，不幸的是，当我点击左键不起作用时，右键相反。有人可以提出任何想法我怎么能解决它。

我的js脚本：

function moveLeft() {

$("#carousel").animate({marginLeft:'+400px'},1000,function(){
$(this).find(".slide-items:first").after($(this).find(".slide-items:last"));
$(this).css({marginLeft:''});
});

}

function moveRight() {

$("#carousel").animate({marginLeft:'-400px'},1000,function(){
$(this).find(".slide-items:last").after($(this).find(".slide-items:first"));
$(this).css({marginLeft:''});
});


}

$('#left').on('click', function(){
moveLeft();
});

$('#right').on('click', function(){
moveRight();
});

请参阅演示here

Answer 1

$(document).ready(function(){

function moveLeft() {
$("#carousel").find(".slide-items:first").before($("#carousel").find(".slide-items:last"));
$("#carousel").css({marginLeft:'-400px'});
$("#carousel").animate({marginLeft:''},1000,function(){
});

}

function moveRight() {

$("#carousel").animate({marginLeft:'-400px'},1000,function(){
$(this).find(".slide-items:last").after($(this).find(".slide-items:first"));
$(this).css({marginLeft:''});
});


}

$('#left').on('click', function(){
moveLeft();
});

$('#right').on('click', function(){
moveRight();
});


});

检查表单here