CODEWITHSUNDEEP
javascriptdojoloops
matbergman
matbergman

Reputation: 43

Dojo: Iterate through chained animations?

I have a simple animation built with the Dojo animation class that displays five hidden list items in ten second increments. Here's an example:

dojo.fx.chain ([

dojo.animateProperty({ node:progressList[0], duration:listItemDuration, onEnd:function(){ dojo.style(this.node, 'display', 'block'); }
}),

...

dojo.animateProperty({ node:progressList[5], duration:listItemDuration, onEnd:function(){ dojo.style(this.node, 'display', 'block'); }
}) ]).play();

Listing these properties individually is cumbersome. It makes more sense to iterate through a single dojo.animateProperty.

Is it possible to iterate through elements in dojo.fx.chain, using dojo.forEach or some other method?

Upvotes: 2

Views: 229

Answers (1)

mrtom
mrtom

Reputation: 2156

Definitely.

Something like:

    var hiddenNodes = dojo.query('.hidden');
    var anims = [];
    hiddenNodes.forEach(function(n) {
        anims.push(dojo.animateProperty({
            node: n,
            properties: {
                color: 'red'
            },
            duration: 1000
        }));
    });

    var finalAnim = dojo.fx.chain(anims);

Note, we only create this once. Afterwards finalAnim can be passed around and have play() called on it at will.

Upvotes: 2

Related Questions