this is my jsfiddle :http://jsfiddle.net/Z7a5h/

As you can see the animation of the sprite sheet when the player is not moving is too fast so i was trying to make it slow by declaring two variable lastRenderTime: 0,RenderRate: 50000

but my code is not working and it seem i have a misunderstanding of the algorithm i am using so can anyone lay me a hand to how can i fix it ?

 if (!this.IsWaiting) {
                    this.IsWaiting = true;
                    this.Pos = 1 + (this.Pos + 1) % 3;

                else {
                    var now = Date.now();
                    if (now - this.lastRenderTime < this.RenderRate) this.IsWaiting = false;
                    this.lastRenderTime = now;


1 Answer 1


There's two issues in your code.

Firstly, you update the lastRenderTime at each iteration so now - this.lastRenderTime has always more or less the same value (the time between now and the last iteration).
Your assignation (this.lastRenderTime = now) should be inside your if brackets.

Secondly, you're doing your comparison the wrong way. you should check if the time since the last image change is greater than your RenderRate: now - this.lastRenderTime >= this.RenderRate but you're doing the opposite.

Due to these issues, your condition is always true and, then, the image changes at every single iteration.

  • \$\begingroup\$ thank you for your answer could you please update my jsfiddle please \$\endgroup\$
    – Sora
    Mar 27, 2014 at 14:02
  • 1
    \$\begingroup\$ Meh, that's not how it works / is interesting / is constructive. I think my points are quite clear. If not I'll be glad to explain some more. But just fix/debug code in a fiddle isn't the right way. \$\endgroup\$
    – user43240
    Mar 27, 2014 at 14:20
  • 1
    \$\begingroup\$ Third problem: the modern preferred way to update at a regular interval is window.requestAnimationFrame @Sora although it's not against the rules to ask, please don't demand a jsfiddle update in order to vote this as the answer to question. SE isn't a fiddle-correction machine, it's a Q&A site. \$\endgroup\$ Mar 27, 2014 at 14:20
  • \$\begingroup\$ You're right for window.requestAnimationFrame. That is not something making the code don't work though. \$\endgroup\$
    – user43240
    Mar 27, 2014 at 14:23
  • \$\begingroup\$ well i tried to fix the issue but my problem remain this is my update : jsfiddle.net/Z7a5h/3 \$\endgroup\$
    – Sora
    Mar 27, 2014 at 14:25

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .