Wie kann man eine Schleife in einer Animation neu starten?

Question

Ich versuche ein Spiel wie Space Invader zu bauen (da ich erst vor 5 Tagen angefangen habe zu programmieren), wo ein Zombie verschwindet, wenn ein Schuh den Zombie trifft, erscheint er wieder oben auf dem Bildschirm (kommt wieder runter). Ich kann einfach nicht scheinen, die Zombie zu machen, nach oben zurück (sie am tiefsten Punkt der Animation bleiben)

Unten ist der Test für die Kollision:

function zombietestCollision(position1, size1, position2, size2) { 
if (((position1.left + size1.width) > position2.left) && 
    ((position1.top + size1.height) > position2.top) && 
    ((position2.left + size2.width) > position1.left) && 
    ((position2.top + size2.height) > position1.top)) { 

     function loop() { 
      movedown($zombie); 
      moveup($zombie); 
     }; 
     $(function zombieloop() { 
      setInterval(loop, 1); 
     }); 
} 
} 

ich diesen Test umfasste haben in meiner Abwärtsbewegung des Zombies

// down movement of the zombies 
function movedown($zombie) {  
$zombie.animate({ 
    'left': 300, 
}, { 
     duration:5000, 
     step:function(){ 

      $.each($("#zombie"), function(index,zombie) { 

       var $zombie = $(zombie); 
       var $shoe = $("#shoe"); 

       var shoeSize = { 
        height: $shoe.height(), 
        width : $shoe.width() 
       }; 

       var zombieSize = { 
        height: $zombie.height(), 
        width : $zombie.width() 
       }; 

       zombietestCollision($shoe.position(), shoeSize, $zombie.position(), zombieSize); 


      }); 
} 

Wenn ich das ausführen, ist der Bildschirm nur leer. Was habe ich richtig gemacht? Hier ist der vollständige Code: http://jsfiddle.net/JKd9K/7/

Sorry, aber ich bin völlig neu in der Programmierung, so ist es schwer für mich zu verstehen, welchen Teil ich falsch gemacht habe. Prost!

Answer 1

Sie müssen vorsichtig sein, wie Sie Funktionen schließen. Werfen Sie einen Blick auf diese http://jsfiddle.net/JKd9K/2/

Ihre Funktion Movedown wie diese

function movedown($zombie) { 
    $zombie.animate({ 
     'left': 300 
    }, { 
     duration: 5000, 
     step: function() { 
      $.each($("#zombie"), function(index, zombie) { 
       var $zombie = $(zombie); 
       var $shoe = $("#shoe"); 
       var shoeSize = { 
        height: $shoe.height(), 
        width: $shoe.width() 
       }; 
       var zombieSize = { 
        height: $zombie.height(), 
        width: $zombie.width() 
       }; 
       zombietestCollision(
        $shoe.position(), 
        shoeSize, 
        $zombie.position(), 
        zombieSize); 
      }); 
     } 
    }); 
} 

Hinweis sein sollte, dass es am Ende eine Reihe von zusätzlichen Verstrebungen ist.