jQuery实现无缝轮播图

以下为实现无缝轮播图主要代码：

var index = 0; //当前页码 
var timer = null;//定时器
//为了弥补短暂的间隔,将第一张克隆一个放置最后面
$(".slide-img li").first().clone().appendTo(".slide-img");
//设置宽度
$(".slide-img").width(730*$(".slide-img li").length);
//实现自动切换
function autoplay(){
//定时切换功能
timer = setInterval(function(){
index++;
console.log(index);
moveImg();//执行图片切换滑动
},1000);
}
//往前翻页
$(".prev").click(function(){
index--;
moveImg();//切换
})
//往后翻页
$(".next").click(function(){
index++;
moveImg();//切换
});
//鼠标悬停、移开 实现轮播图的暂停与播放
$(".slide").hover(function(){
clearInterval(timer);
},function(){
autoplay();
});
//定义一个切换图片函数
function moveImg(){
console.log(index);
//在最后一页的时候处理
if(index>=$(".slide-img li").length){
index=1; //因为第一张和最后一张都是一样的，如果是设置为0，那么将会停留两倍间隔
//把图片容器重新设置回到0位置
$(".slide-img").css("left",0);
}
//如果是-1
if(index==-1){
index = $(".slide-img li").length - 2;
$(".slide-img").css("left",-(index+1)*730);//重新设置回去0的位置
}
$(".slide-img").animate({
left:-730*index
},400,function(){
//更换按钮样式 ,注意: 按钮只有5个， 但图片其实有6张 ，在第6张的时候，应该是给第一个按钮设置样式 
if(index==$(".slide-img li").length-1){
$(".slide-page li").eq(0).addClass("active").siblings().removeClass("active");
}else{
$(".slide-page li").eq(index).addClass("active").siblings().removeClass("active");
}
})
}
//初始化，执行
autoplay();