Создайте элемент Raphael в одном setTimeout, удалите его в другом setTimeout - PullRequest
Новая
       0

Создайте элемент Raphael в одном setTimeout, удалите его в другом setTimeout

0 голосов
/ 08 июля 2011

Я пытаюсь создать анимацию, в которой я создаю 4 круга в Рафаэле через 10 секунд после загрузки страницы.Затем, через 10 секунд, я хочу удалить все эти круги и сделать еще 10 (10 новых кругов с именами, отличными от оригинальных 10).

Вот что у меня есть: 

var paper = Raphael(0, 100, 1350, 800);

setTimeout(function() {
    var a1 = paper.circle(200,200,100);
    var a2 = paper.circle(300,300,100);
    var a3 = paper.circle(400,400,100);
    var a4 = paper.circle(500,500,100);
}, 10000);

setTimeout(function() {
    a1.remove();
    a2.remove();
    a3.remove();
    a4.remove();

    var b1 = paper.circle(300,200,100);
    var b2 = paper.circle(400,300,100);
    var b3 = paper.circle(500,400,100);
    var b4 = paper.circle(600,500,100);
}, 20000);

Однако, когда я добираюсь до отправки setTimeout, .remove() ничего не делает.Они убивают остальную часть сценария.Когда я вынимаю их, новые круги создаются просто отлично, но я не могу избавиться от первого сета.

Я понимаю, что это что-то с привязками, но я не могу заставить его работать.Я попытался сделать это в первом setTimeout: 

setTimeout(function() {
    var a1 = paper.circle(200,200,100);
    $(a1.node).live();
    var a2 = paper.circle(300,300,100);
    $(a2.node).live();
    var a3 = paper.circle(400,400,100);
    $(a3.node).live();
    var a4 = paper.circle(500,500,100);
    $(a4.node).live();
}, 1000);

Но когда он доберется до первого .live(), он умрет.

Любой совет?Я чувствую, что есть кое-что очень простое, что я скучаю.Может быть, какое-то закулисное объяснение того, что он пытается сделать?

Я буду расширять это почти до 100 кадров (100 setTimeouts).Любой совет, как сделать это более эффективным?Я немного новичок в этом.Любой совет будет оценен.

1 Ответ

1 голос
/ 08 июля 2011

Это потому, что круги были объявлены внутри анонимной функции, переданной первому setTimeout.Если вы удалите var из объявлений переменных, они будут глобальными, и ваш код должен работать.

Под глобальным я имею в виду, что они будут принадлежать window.Вы можете ссылаться на них как window.varname или просто varname (если в той же области, где вы пытаетесь сослаться на varname), нет var varname.

...