我正在寻找一个重启和停止自定义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);
}
我能够通过函数内部的clickEvent附加clearInterval(timingRun)来完成这项工作!