将animate函数绑定在#next按钮上:
next.onclick = function () {
if (index == 5) {
index = 1;
}
else {
index += 1;
}
animate(-600);
showButton();
}
animate函数如下设计:
function animate(offset){
var newLeft = parseInt(list.style.left) + offset + 'px';//设置目标值
var interval = 10;
var time = 300;
var speed = offset/(time/interval);
function go(){
if( (speed < 0 && parseInt(list.style.left) > newLeft) || (speed > 0 && parseInt(list.style.left) < newLeft)){
list.style.left = parseInt(list.style.left) + speed + 'px';
setTimeout(go,interval);//多次位移
}else{
list.style.left = newLeft + 'px';
if(parseInt(list.style.left) > -600){list.style.left = '-3000px'}
if(parseInt(list.style.left) < -3000){list.style.left = '-600px'}
}
}
go();
}
我的问题是:为什么点击按钮,图片无法动起来?
if( (speed < 0 && parseInt(list.style.left) > newLeft)