Question

I am trying the following, but cant get the function to run itself again (I am trying to create some kind of looping animation)

$(document).ready(function() {



       //function loopingFunction(){

       function loop() {
            $('#item').animate({top:'+=100'}, 500, function() {
                $('#item').animate({top:'-=100'},500, function(){
                    loop;
                });
            });
       }


});

Answer 1

Either:

function loop() {
        $('#item').animate({top:'+=100'}, 500, function() {
            $('#item').animate({top:'-=100'},500, function(){
                loop();
            });
        });
   }

Live Example: http://jsfiddle.net/vyef6/

or

function loop() {
        $('#item').animate({top:'+=100'}, 500, function() {
            $('#item').animate({top:'-=100'},500, loop);
        });
   }

Live example: http://jsfiddle.net/w92b2/

Explaination: In the first one, you are literally executing the loop function. Therefore needs the parenthesis. Ine the second you’re passing a reference,or callback, to the loop function in to animate – therefore it doesnt need the parenthesis.