Пишу себе велосипед, кубик должен бесконечно двигаться вправо и возвращаться.
Происходит только 1 итерация.Если добавить в left_go() в else if{ setInterval(right_go, 5);} , все работает, но со временем анимация начинает тормозить и зависать.
Помогите пожалуйста?
var animate_right = setInterval(right_go, 5);
function right_go () {
var left_padding = cube_style.left;
if (left_padding!=width_square){
cube.style.left = x +"px";
x++;
console.log(left_padding);
}
else if(left_padding=width_square){
clearInterval(animate_right);
var animate_left = setInterval(left_go, 5);
}
}
function left_go (animate_left) {
var left_padding = cube_style.left;
if (left_padding!='-1px'){
cube.style.left = x +"px";
x--;
console.log(left_padding);
}
else if(left_padding!=width_square){
clearInterval(animate_left);
}
}
Ответ
Oбе переменные, animate_left и animate_right, должны быть глобальными, а у Вас clearInterval(animate_left); ничего не делает, так как переменная animate_left в этом месте не определена. Соответственно, таймеры с left_go через каждые 5 миллисекунд накапливаются, и все тормозит.
Код должен быть симметричен относительно left и right
var animate_right = setInterval(right_go, 5);
var animate_left = null;
function right_go () {
var left_padding = cube_style.left;
if (left_padding!=width_square){
cube.style.left = x +"px";
x++;
console.log(left_padding);
}
else if(left_padding=width_square){
clearInterval(animate_right);
animate_left = setInterval(left_go, 5); // !!! no var
}
}
Комментариев нет:
Отправить комментарий