javascript - Canvas Game Animation

Question

So I a making a game and got the idea of having a semi transparent png animation from a spritesheet to appear when the player gets put back to the start after he dies.

http://www.youtube.com/watch?v=s2Vwyqo_y_A

It's just I have never gotten around to animation yet a for some reason I think the manipulating the animrequestframe thingy kinda confusing. I have it set so my game refreshes every 60 times a second.

Would love some advice to help me out! :/ It's my first 'proper' game!

Answer 1

If you're struggling getting your head around requestFrameAnimation, I suggest you read these couple of links, they explain it really well:

1. The secret to silky smooth JavaScript animation!
2. Using requestAnimationFrame

The simplest example given:

function gameLoop() {
  // Game logic
  requestAnimationFrame(gameLoop);
}
requestAnimationFrame(gameLoop);

EDIT: You mention you want your game to run every at 60 FPS. Request animation will run your game as fast as it can - which is a good thing - but there are tricks to set the actual FPS. However, unless you're aiming for a lower FPS, like 30, I wouldn't bother.