title: Stop an executing recursive javascript function
body: <p>Using jQuery, I've build an image/slide rotator. The basic setup is (in pseudocode):</p>
  
  <pre><code>function setupUpSlide(SlideToStartWith){
      var thisSlide = SlideToStartWith;
      ...set things up...
      fadeInSlide(thisSlide)
  }
  
  function fadeInSlide(thisSlide){
      ...fade in this slide...
      fadeOutSlide(thisSlide)
  }
  
  
  function fadeOutSlide(thisSlide){
      ...fade out this slide...
      thisSlide.fadeOut(fade, function() {
      var timeout2 = setTimeout(setupUpSlide(nextSlide),100);
      }
  </code></pre>
  
  <p>I call the first function and pass in a particular slide index, and then it does its thing calling  chain of functions which then, in turn, calls the first function again passing in the next index. This then repeats infinitely (resetting the index when it gets to the last item).</p>
  
  <p>This works just fine.</p>
  
  <p>What I want to do now is allow someone to over-ride the slide show by being able to click on a particular slide number. Therefore, if slide #8 is showing and I click #3, I want the recursion to stop and then call the initial function passing in slide #3, which then, in turn, will start the process again.</p>
  
  <p>But I'm not sure how to go about that. How does one properly 'break' a recursive script. Should I create some sort of global 'watch' variable that if at any time is 'true' will return: false and allow the new function to execute?</p>
  
  <p>UPDATE: Added more detailed code showing setTimeout call</p>