简单的 jQuery 轮播效果不好答案

【问题标题】：Simple jQuery carousel doesnt working well简单的 jQuery 轮播效果不好
【发布时间】：2016-02-17 07:56:33
【问题描述】：

我创建了一个简单的 jQuery 轮播滑块。可以看demo 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

【问题讨论】：

标签： jquery slider carousel

【解决方案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

【讨论】：