title: Adding a Next and Previous button that reset the timer on a Jquery image slider
body: <p>I've been working on this slider for a bit, and I've got it to auto play with some nice simple Jquery markup. I decided I wanted to have the option to go to previous and next on the slider, but I'm not sure if it's possible with the set up I have. I've got a "Next" Button set up that moves to the next image. My problem lies in getting the timer to restart after you hit next in the code. Is this possible to do, am I just overlooking something? I also am wondering how to I create the equivalent of the "next" button for a "previous" button. Any help would be appreciated, since I've been banging my head against this one for while.</p>
  
  <p>Here is the Jquery I'm using:</p>
  
  <pre><code>var time = 6000;     
  
  function play() {
      setInterval(function(){
          var next = $(".slideshow .active").removeClass("active").next(".image");
          if (!next.length) {
              next = $(".slideshow .image:first");
          }
          next.addClass("active");
      }, time);
  }
  play();
  
  /*Start of function for next button  */
  
  function forward() {
    $('.forward').click(function() {
        var go = $(".slideshow .active").removeClass("active").next(".image").addClass("active");
         if (!go.length) {
           go = $(".slideshow .image:first");
         }
         go.addClass("active");
      });
  }
  
  forward();
  </code></pre>
  
  <p>I've created a CodePen(<a href="http://codepen.io/Develonaut/pen/lLmkc" rel="nofollow">http://codepen.io/Develonaut/pen/lLmkc</a>) to try and work this out. I will gladly give credit on the CodePen for whoever helps. Thanks so much!</p>