Change background color of HTML elements with JavaScript in a certain time period?

Question

I have around 26 html elements for which I want the following effect in JavaScript:

Is it pos

Answer 1

css

div {
    display:block;
    background:black;
    width:200px;
    height:40px;
    margin:2px 0px 0px 0px;
}

html

....

js

function animateStuff(domElements, baseColor, activeColor, delay) {
    var count=0;
    var animationRun=1;
    var frames=0;
    function frame() {
        frames++;

        if((frames%delay)==1){//set delay only animate on loops that the set delay has past.
            count++;
            if(count>=domElements.length){
                count=0;//back to the beginning of the loop.
            }
            // make all the divs black
            for(var x=0;x

RequestAnimationFrame() will give you a consistent ~60fps on average. It also stops the animation loop when the tab is not being displayed. The animation starts when the tab is being displayed. (frames%delay)==1 is to slow down the animation so its visible.

A good example of using this method is a javascript game engine i made source available here. https://github.com/Patrick-W-McMahon/Jinx-Engine