自定义jQuery滑块的停止和重新启动功能

Question

我在寻找重新启动和停止自定义jQuery滑块的解决方案。

我已插入自定义jQuery的滑块从这里：http://jsfiddle.net/mjaA3/1662/

我已经使用滑块在同一页三个幻灯片。 这三个幻灯片放在三个按钮的内部，它们在激活时播放电影，并在电影播放时显示按钮内的幻灯片 。

当这三个按钮中的另一个被激活时，我想让这些按钮内的幻灯片重置（并停止）， 。

现在，幻灯片显示从单击按钮 时调用的函数开始。但它仍然需要重新设置，否则它会叠加（并且仍在播放）。

这是小提琴的缩短代码：

var triggers = window.vorher.find('.fortschrittwrap .note'); 
    var images = window.vorher.find('.notificationwrap .ce_text'); 
    var lastElem = triggers.length-1; 
    var target; 

    triggers.first().addClass('active'); 
    images.hide().first().show(); 

    function sliderResponse(target) { 
     images.fadeOut(300).eq(target).fadeIn(300); 
     triggers.removeClass('active').eq(target).addClass('active'); 
    } 

    triggers.click(function() { 
     if (!$(this).hasClass('active')) { 
      target = $(this).index(); 
      sliderResponse(target); 
      resetTiming(); 
     } 
    }); 



    function sliderTiming() { 
     target = window.vorher.find('.fortschrittwrap .note.active').index(); 
     target === lastElem ? target = 0 : target = target+1; 
     sliderResponse(target); 
    } 

    var timingRun = setInterval(function() { sliderTiming(); },5000); 
    function resetTiming() { 
     clearInterval(timingRun); 
     timingRun = setInterval(function() { sliderTiming(); },5000); 
    } 

Answer 1

我能够用连接至clickEvent功能的内部clearInterval（timingRun）做到这一点！