javascript - 轮播图动画问题
本文介绍了javascript - 轮播图动画问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
将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)
在上面的
newLeft
是一个字符串,看用parseInto()
转换下看
这篇关于javascript - 轮播图动画问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文