在动画函数那里感觉用setinterval也行，但是很奇怪的是我用setinterval来写里面一些参数值会发生变化；比如说我setinterval函数写在前面，后面写了句index=end（所点击的小圆点的index），setinterval函数里面有用到index的值，但是函数里面的index值会突变为end的值。。。。
window.onload = function() {
index=1;//当前页码
len=5;//图片张数
btn = document.getElementsByTagName("span");//获得众多小圆点元素
document.getElementsByTagName("span")[0].className="active";//设置第一个小圆点样式为active
for(var i = 0; i < len; i++) {
btn[i].onclick = function() {
if(this.className=="active"){//如果摁了当前页面的小圆点，就不执行下面的函数
return;//不能用break;
}
//获得摁的是第几个小圆点
pointNum=parseInt(this.getAttribute("index"));//一定要加parseInt
offset=-669*(pointNum-index);//计算位移
function slidepage(offset){//滑动动画
n =1;
img = document.getElementsByClassName("content")[0];
end=parseInt(img.style.marginTop)+offset;//计算终点
speed=offset/3;
setInterval("go(index,pointNum,speed)",40);
if(end<-6*669){//如果终点在第6张图片，就返回第1张图片
img.style.marginTop=-669+"px";
}
}
slidepage(offset);
showbutton(pointNum);
}
}
}
function showbutton(num){//小圆点的颜色变化
for(var i=0;i<len;i++){
if(btn[i].className=="active"){//清除有active样式的小圆点的样式
btn[i].className="";
break;
}
}
index=num;
btn[index-1].className="active";//给当前小圆点添加active样式
}
function go(index,pointNum,speed){
if(n == 3*(pointNum-index)) {
clearInterval();
}
img.style.marginTop=parseInt(img.style.marginTop)+speed+"px";
n++;
}