title: Reset slide interval JQuery
body: <p>I've made a slide show width a javascript and Jquery. But I need to reset the slide interval when the user is navigating manualy to the next or previous slide. I am relatively new to javascipt and it's syntax. Any help will be appriciated. Here is my code:</p>
  
  <pre><code>&lt;script type="text/javascript" src="/elements/jquery-1.4.2.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
      var currentSlideId = 0;
      var slidesAmount = 0;
  
      function selectSlide(id) {
          jQuery(".startpage-test.slide" + id).show().siblings(".startpage-test").hide();
          jQuery(".slideshow-show-active.slide" + id).addClass("active").siblings(".slideshow-show-active").removeClass("active");
      }
  
      function nextSlide() {
          currentSlideId++;
          if (currentSlideId &gt;= slidesAmount) currentSlideId = 0;
  
          selectSlide(currentSlideId);
      }
  
      function prevSlide() {
          currentSlideId--;
          if (currentSlideId &lt; 0) currentSlideId = slidesAmount - 1;
  
          selectSlide(currentSlideId);
      }
  
      jQuery(document).ready(function() {
          slidesAmount = jQuery(".startpage-test").length;
  
          jQuery(".show_previous").click(function() {
              prevSlide();
              return false;
          });
  
          jQuery(".show_next").click(function() {
              nextSlide();
              return false;
          });
  
          window.setInterval(function() {
             nextSlide();
          }, 7000); 
      });
  
      jQuery("object.flashContent").each(function () {
          swfobject.registerObject(jQuery(this).attr("id"), "9.0.0");
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>The next-/prev-button looks like this:</p>
  
  <pre><code>       &lt;div class="show_next"&gt;
                      &lt;a href="#"&gt;&lt;span class="slide_nav"&gt;&lt;img src="/elements/next.png" width="57" alt="Next"&gt;&lt;/span&gt;&lt;/a&gt;
                  &lt;/div&gt;
             &lt;div class="show_previous"&gt;
                      &lt;a href="#"&gt;&lt;span class="slide_nav"&gt;&lt;img src="/elements/prev.png" width="57" alt="Previous"&gt;&lt;/span&gt;&lt;/a&gt;
                  &lt;/div&gt;
  </code></pre>
  
  <p>In all slides there is a link of course, and it would also be nice to stop the slide interval when hovering this a-tag. Unfortunately I don't know how to do this either.</p>