What's the best way to animate something in canvas?

Question

I'm trying to animate a triangle "flipping" in canvas using javascript. The problem is that javascript performs the animation too fast and you can't really see the effect. What's the best way to "slow it down". I've tried the setTimeout function but it doesn't work because it delays the execution of the function to redraw my triangle but continues with the execution of the redraw loop, if that makes any sense. Are there any jQuery functions to delay execution> I saw the delay() function but I don't think that's applicable in this case? Let me show you what I have as of now:

http://jsfiddle.net/hnqB6/7/

Any suggestions welcome :)

Answer 1

Here is the code for the answer. I use setInterval to for the animation and the data() jQuery function to allow the animation to store data about each canvas.

http://jsfiddle.net/kerrmarin/V8Dme/1/