jQuery - フォーカスが別のChromeタブにあったときにイメージの回転が速くなる

Question

GoogleのChromeを使用しているときに、画像の回転がうまく動作します。しかし、別のタブを開いて他のページを見ると、ページに戻ったとき（ページがロードされているタブをクリック）、画像の回転はやや速いです！

私はfadeIn（）とfadeOut（）を使って画像を表示したり隠したりします。また、このコードは、$（document）.ready（）でsetTimeout（）を使用して開始され、関数の最後にsetTimeout（）が使用されている別の関数で囲まれています（前述の関数）。

これを解決するにはどうすればよいですか？

EDIT

コードを使用：

var initialFadeIn = 1000; 
    var itemInterval = 5000; 
    var fadeTime = 2500; 
    var numberOfItems = 0; 
    var currentItem = 0; 

    $(document).ready(function() { 

     numberOfItems = $('.banner-img').length; 
     $('.banner-img').eq(currentItem).fadeIn(initialFadeIn); 

     var imgTitle = $('.banner-img').eq(currentItem).attr('title'); 
     $('.banner-title').text(imgTitle); 

     setTimeout(imgLoop, itemInterval); 

    }); 

    function imgLoop() 
    { 
     $('.banner-img').eq(currentItem).fadeOut(fadeTime); 

     if(currentItem == numberOfItems -1){ 
      currentItem = 0; 
     }else{ 
      currentItem++; 
     } 
     $('.banner-img').eq(currentItem).fadeIn(fadeTime); 

     imgTitle = $('.banner-img').eq(currentItem).attr('title'); 
     $('.banner-title').text(imgTitle); 

     setTimeout(imgLoop, itemInterval); 
    } 

Answer 1

ソリューション：

をturziferが示唆したように、私はサイクルのプラグインを使用：http://jquery.malsup.com/cycle/

をし、画像上のキャプションを表示するには、I使用：

この例のように

<script type="text/javascript"> 
$(function() { 
$('#slideshow').cycle({ 
    fx:  'fadeZoom', 
    timeout: 2000, 
    before:  function() { 
     $('#caption').html(this.alt); 
    } 
}); 
}); 
</script> 

：http://jquery.malsup.com/cycle/caption.html