How Do Create Perpetual Animation Without Freezing?

I am still a newbie at Javascript. I tried writing a program to make images fadeToggle all the time, so I used the while conditional statement (combined with a constant variable);

Solution 1:

Since Javascript is asynchornous there is no sleep methode. But instead, a good idea is to use setInterval or setTimeout.

Without these function, your loop is going to take as most ressources as it can and it can result in a freeze (depending on your browser).

Solution 2:

Just use callbacks already provided by jQuery animations like .fadeToggle:

functionfadeToggleForever ($e) {
    $e.fadeToggle({
        duration: 2600,
        // start another fadeToggle when this one completes
        complete: function () { fadeToggleForever($e) }
    });
}

// main code
fadeToggleForever($('.pimg'));

The of using the complete callback works because jQuery animations internally use setTimeout (or perhaps setInterval) and thus "yield" code execution so that the browser can continue reacting to user input and updating the display.