title: prevent function from running twice
body: <p>I have a slideshow which runs automatically and you can skip to an image by clicking on a button. </p>
  
  <p>It works fine if you click one of the buttons when the image is static, but if you click while the fade functions are running it will run the functions twice which creates some kind of loop which eventually grinds the browser to a stand still!</p>
  
  <p>I know I need to add some kind of "isRunning" flag, but I don't know where.</p>
  
  <p>Here's a link to a jsfiddle - <a href="http://jsfiddle.net/N6F55/8/" rel="nofollow">http://jsfiddle.net/N6F55/8/</a></p>
  
  <p>And code also below...</p>
  
  <p>javascript:</p>
  
  <pre><code>$(document).ready(function() {
  
  var images=new Array();
  var locationToRevealCount=6;
  var nextimage=2;
  var t;
  var doubleclick;
  
  addIcons();
  
  function addIcons() {
      while (locationToRevealCount&gt;0) {
          $("#extraImageButtons").append('&lt;img class="galleryButtons" src="http://www.steveszone.co.uk/images/button_sets/pink_square_button1n.png" alt="'+locationToRevealCount+'" /&gt;');
          images[locationToRevealCount]='http://www.tombrennand.net/'+locationToRevealCount+'a.jpg';
          locationToRevealCount--;
      };
      $('.homeLeadContent').prepend('&lt;img class="backgroundImage" src="http://www.tombrennand.net/1a.jpg" /&gt;');
      $("#extraImageButtons img.galleryButtons[alt*='1']").attr("src","http://www.steveszone.co.uk/images/button_sets/black_square_button1n.png");
      runSlides();
  }
  
  function runSlides() {
      clearTimeout(t);
      t = setTimeout(doSlideshow,3000);
  }
  
  function doSlideshow() {
      if($('.backgroundImage').length!=0)
          $('.backgroundImage').fadeOut(500,function() {
              $('.backgroundImage').remove();
              slideshowFadeIn();
          });
      else
          slideshowFadeIn();
  }
  
  function slideshowFadeIn() {
      if(nextimage&gt;=images.length) 
          nextimage=1;
  
      $("#extraImageButtons img.galleryButtons").attr("src","http://www.steveszone.co.uk/images/button_sets/pink_square_button1n.png");
      $("#extraImageButtons img.galleryButtons[alt*='"+nextimage+"']").attr("src","http://www.steveszone.co.uk/images/button_sets/black_square_button1n.png");
  
      $('.homeLeadContent').prepend($('&lt;img class="backgroundImage" src="'+images[nextimage]+'" style="display:none;"&gt;').fadeIn(500,function() {
          nextimage++;
          runSlides();
  
      }));
  }
  
  $("#extraImageButtons img.galleryButtons").live('click', function() {
      nextimage=$(this).attr("alt");
      $("#extraImageButtons img.galleryButtons").attr("src","http://www.steveszone.co.uk/images/button_sets/pink_square_button1n.png");
      $(this).attr("src","http://www.steveszone.co.uk/images/button_sets/black_square_button1n.png");
      clearTimeout(t);
      doSlideshow();
  });
  });
  </code></pre>
  
  <p>html:</p>
  
  <pre><code>&lt;div class="homeLeadContent" style="width:965px;"&gt;
  
  &lt;/div&gt;
  &lt;div id="extraImageButtons"&gt;&lt;/div&gt;
  </code></pre>