<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script><script type="text/javascript">
$(document).ready(function(){
var pro_list=$(".pro_list");//图片滚动块
var pro_width=0;
var index;//索引初始值
var total_width=$(".pro_list li").width()*($(".pro_list li").length-1);//最大位移坐标值等于图片块的宽度乘以图片总是减1
$(".right").click(function(){
if(!pro_list.is(":animated")){
if(pro_width==total_width){
return false;
}else{
pro_list.animate({left:"-="+800},800);
pro_width+=800;
index=$(".item a.click").index();
index++;
$(".item a").eq(index).addClass("click").siblings().removeClass("click");//让选择的索引值加1并且添加样式，它的同辈元素移除此样式
}
}
});//向右位移或者是下一张
$(".left").click(function(){
if(!pro_list.is(":animated")){
if(pro_width==0){
return false;
}else{
pro_list.animate({left:"+="+800},800);
pro_width-=800;
index=$(".item a.click").index();
index--;
$(".item a").eq(index).addClass("click").siblings().removeClass("click");//让选择的索引值减1并且添加样式，他的同辈元素移除该样式
}
}
});//向左位移或者上一张
var item_a=$(".item a");
item_a.click(function(){
$(this).addClass("click").siblings().removeClass("click");
pro_width=$(".pro_list li").width()*($(this).index());//图片位移的单位
pro_list.animate({left:"-"+pro_width},800);
n=$(this).index();
}); //索引切换图片
n=0;
count=$(".pro_list li").length;
t = setInterval(function(){
n=n >=(count-1)?0:++n;
$(".item a").eq(n).trigger('click');
},4000);//执行定义好的函数
});
</script>
转载请注明：前端录»自动轮播图，带左右切换
