title: JQuery slideshow : Firefox v.13.0.1
body: <p>I am using the following script for slideshow gallery, it should rotate a few pics one after the other each 10 seconds.</p>
  
  <p>It worked  ( in FF) until I upgraded Firefox to version 13.0.1. </p>
  
  <p>At the moment, if it runs for a while, then it gets messed up -  it neglects the timer,  rotates only 2 pics, and completely neglects the other 3.     </p>
  
  <p>How can I fix this issue and  make the script more robust?</p>
  
  <p>Thank you!!!</p>
  
  <pre><code>function slideSwitch() {
      var $active = $('#slideshow div.active');
  
      if ( $active.length == 0 ) $active = $('#slideshow div:last');
  
      //  pull the divs in the order they appear in the markup
      var $next =  $active.next().length ? $active.next() : $('#slideshow div:first');
      $active.addClass('last-active');
  
      $next.css({opacity: 0.0})
          .addClass('active')
          .animate({opacity: 1.0}, 3000, function() {
              $active.removeClass('active last-active');
          });
  }
  
  $(function() {
      var timer = setInterval( "slideSwitch()", 10000 );
  
          $('#slideshow').hover(
                  function () {
                      clearInterval(timer);   
                  },  
                  function () {
                      timer = setInterval("slideSwitch()", 10000);            
                  }
          ); 
  
  });
  </code></pre>
  
  <p>I call the jquery in html via: </p>
  
  <pre><code>                    &lt;div id="slideshow"&gt;
                          &lt;div class="active"&gt;
                              &lt;img src="/images/slideImages/1.jpg" alt="xxx 1" title = "xx 1"/&gt;
                          &lt;/div&gt;
                          &lt;div&gt;
                              &lt;img src="/images/slideImages/2.jpg" alt="xxx 2" title="xx 2" /&gt;
                          &lt;/div&gt;
                          &lt;div&gt;
                              &lt;img src="/images/slideImages/3.jpg"  alt="xxx 3" title="xx 3" /&gt;
                          &lt;/div&gt;
                          &lt;div&gt;
                              &lt;img src="/images/slideImages/4.jpg"  alt="xx 4" title="xx 4"  /&gt;
                          &lt;/div&gt;
                          &lt;div&gt;
                              &lt;img src="/images/slideImages/5.jpg"  alt="xxx 5" title="xx 5"  /&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
  </code></pre>