title: Stopping a running function in javascript/jquery on click event
body: <p>I have a slideshow function in jquery that I want to stop on a particular click event. The slideshow function is here:</p>
  
  <pre><code>function slider(){
     setInterval(function(){
     var cur = $('img.active');
     cur.fadeOut('fast');
     cur.removeClass('active');
     cur.css('opacity','0');
     cur.addClass("hidden");
     var nextimg;
     if (!cur.hasClass("last")){
       nextimg = cur.next("img");
       }
     else {
       nextimg = cur.prev().prev().prev();
    }
     nextimg.removeClass("hidden").fadeIn('slow').css('opacity','1').addClass('active');
    },5000);
   }
  </code></pre>
  
  <p>I have been reading about .queue but not sure how I can use it exactly, can I call my function from a queue and then clear the queue on a click event? I cannot seem to figure out the syntax for getting it to work of if thats even possible. Any advice on this or another method to stop a running function on a click would be appreciated.</p>