Question

Okay,
So I am building an ajax based game. Anyway it is multiplayer, connects to a server. It polls the server, getting updates all the time. Anyway the game has different game states, and must animate the GUI based on the game state.

The problem is, however; When the window is not focused, jquery animations queue up and do not render. This means say a user walks away for 5 mins and comes back, a huge queue of obsolete animations start to run through one by one.

So I was wondering if there is any way to force jquery animations to run when they are called and not wait for a focused window?

For further information on why this happens, read Additional Notes, in the jquery documentation here http://api.jquery.com/fadeIn/

Cheers, Josh

Answer 1

Depending on the animations, you could add onfocus event on the body element that gets the animation queue by calling .queue() and if it’s longer than one element, you could call .clearQueue(). Of course you’d have to be careful not to mess up the layout, since it removes all the animations.

Also you could try doing jQuery.fx.off = true if the list is longer than one element. This should set the duration of all animations to 0, which should result in all of the queued animations being finished instantly, and to enable animations once again, set the value to false. However, since I haven’t tried it myself, I’m not sure if it sets the duration only on the animations that haven’t yet been run (already in a queue) or on only those that haven’t yet been added to a queue. If the latter case is true, you could loop through the queue and set each duration to 0 manually.