setInterval double fois à l'occasion

Question

J'ai créé un script de diaporama avec JQuery et j'utilise setInterval (j'ai aussi essayé avec setTimeout et j'ai eu le même problème). Le problème est que lorsque je vais dans un nouvel onglet et que je reviens sur ma page avec le diaporama, le diaporama semble aller à double vitesse. Parfois, il ralentit même et revient à la vitesse normale. Je suis assez confus quant à pourquoi il fait cela. S'il vous plaît noter que j'ai seulement essayé ceci en FF en ce moment.

pictureAmount = 4; 
fadeSpeed = 600; 
delay = 6000; 
heightOfPicture = 320; //px 

function nextSlide(count) { 
    $('#slide-link').fadeOut(fadeSpeed, 'linear', function() { 
     document.getElementById('slide-link').style.backgroundPosition = '0 -' + (heightOfPicture * count) + 'px'; 
    }).fadeIn(fadeSpeed, 'linear'); 
} 

count = 0; 
window.setInterval(function() { 
    if (++count >= pictureAmount) count = 0; 

    nextSlide(count); 
}, delay); 

Voici le lien http://mprodesigns.com/new

Answer 1

Qu'est-ce que vous voyez est un comportement commun (et assez nouveau) dans les navigateurs mis à jour. Ils ralentissent vos minuteurs lorsque les pages sont inactives. Lorsque vous revenez à la page, la minuterie "rattrape".

Il est utile d'éviter complètement "setInterval()" et d'utiliser "setTimeout()" à la place. Avoir votre propre code re-définir le délai d'attente à chaque réveil. De cette façon, vous n'aurez pas beaucoup d'invocations de gestionnaire en attente à exécuter.

Ainsi, au lieu de "setInterval()", vous pouvez le faire:

function timerHandler() { 
    if (++count >= pictureAmount) count = 0; 
    nextSlide(count); 
    setTimeout(timerHandler, delay); 
} 

setTimeout(timerHandler, delay); 

L'effet "ralentir" est imposée par upping le temps de retard minimum. Normalement, lorsque vous vous concentrez sur la fenêtre, c'est comme 10 ou 15 millisecondes. Lorsque l'onglet/fenêtre n'est pas focalisé, cependant, c'est comme 1000 millisecondes.

modifier — Here is a demonstration page qui ne devrait pas montrer une accélération anormale si vous quittez l'onglet et revenir.