title: Pause/resume a series of fadeIn/fadeOuts
body: <p>Say I have a series of divs (#scene1, #scene2, #scene3, etc.) that are fading in/out, one after the other within a function, is there any way how I can click on button to pause these fadein/outs and then resume them again?</p>
  
  <pre><code>fooBar() {
    $("#scene1").fadeIn(500, function() {     
      $("#scene1").delay(5000).fadeOut(500, function() {          
        $("#scene2").delay(1000).fadeIn(500, function() {             
          $("#scene2").delay(5000).fadeOut(500, function() {    
            $("#scene3").delay(5000).fadeIn(500, function() {    
            });
          });
        });
      });
    });
  }
  </code></pre>
  
  <p>So, basically, click on a button to pause in between #scene2/#scene3, then another button to resume? There could be more than three scenes and the pause/resume could happen at any point.  Thanks.</p>