我使用JQuery创建了一个简单的滑块。它使用以下功能:
function moveleft(){
if (current < $length - 1){
$tape.animate({"margin-left":"-=" + $width}, $speed, function(){
current++;
})
}else if(current == $length - 1){
$tape.css("margin-left", 0);
current = 0;
$tape.animate({"margin-left":"-=" + $width}, $speed, function(){
current++;
})
}
};
function moveright(){
if (current == 0){
$tape.css("margin-left", -$last);
current = $length - 1;
$tape.animate({"margin-left":"+=" + $width}, $speed, function(){
current--;
})
}else if (current > 0){
$tape.animate({"margin-left":"+=" + $width}, $speed, function(){
current--;
})
}
}
演示:http://jsfiddle.net/gdgk9wsf/
它可以工作,但问题是当用户点击按钮太快时,它可能没有足够的时间来计算值。所以,一切都是向左或向右走。我可以添加任何东西来修复它吗?
答案 0 :(得分:0)
你可以将函数包装在一个动画检查中,就像这样......
这将确保动画在再次单击之前完成,并执行任何操作。
function moveleft(){
if( $(tape).is(':animated') ) {return}
else{
if (current < $length - 1){
$tape.animate({"margin-left":"-=" + $width}, $speed, function(){
current++;
})
}else if(current == $length - 1){
$tape.css("margin-left", 0);
current = 0;
$tape.animate({"margin-left":"-=" + $width}, $speed, function(){
current++;
})
}
}
};