1

I have image slider where images replace each other by timeout. I use jQuery function setInterval() but there is a small problem, after minimizing browser windows this function keep "working", and where I restore browser window images replace each other with incrediable high speed, like the whole time after window was minimized setInterval() collect actions but executing them after restoring the window.

How to pause setInterval() on browser minimize or keep swap images when windows is minimized?

Yekver
  • 4,985
  • 7
  • 32
  • 49
  • See http://stackoverflow.com/questions/1060008/is-there-a-way-to-detect-if-a-browser-window-is-not-currently-active just pause when not focused, and resume on focus :) – Marco Johannesen Oct 12 '11 at 11:58

1 Answers1

4

The documentation for animate() explicitly mentions:

Because of the nature of requestAnimationFrame(), you should never queue animations using a setInterval or setTimeout loop. In order to preserve CPU resources, browsers that support requestAnimationFrame will not update animations when the window/tab is not displayed. If you continue to queue animations via setInterval or setTimeout while animation is paused, all of the queued animations will begin playing when the window/tab regains focus. To avoid this potential problem, use the callback of your last animation in the loop, or append a function to the elements .queue() to set the timeout to start the next animation.

So, you can either call setTimeout() in the callback of your animation to chain the next cycle, if possible, or queue() the calls to setTimeout() between the calls to animate().

EDIT: As requested in comments, here is a simple queue() example. The code below enforces a two-second delay between the slide animations:

$("selector").slideUp("slow").queue(function(next) {
    window.setTimeout(next, 2000);
}).slideDown("slow");
Frédéric Hamidi
  • 258,201
  • 41
  • 486
  • 479
  • i don't use `animate()`, I just only add & remove class ".active" and fadeIn, fadeOut images. So how should I solve the problem? – Yekver Oct 12 '11 at 13:54
  • @Yekver, I would have to see when and how your animation chain loops in order to improve my answer. Can you update your question with the relevant code? – Frédéric Hamidi Oct 12 '11 at 14:00