4

スライドを自動的に循環させる（を使用して「次へ」関数を定期的に呼び出すsetInterval）が、ユーザーが前/次のボタンをクリックすると停止する（前/次のボタンを使用する）コンテンツスライダーを実行していclearIntervalます。setIntervalボタンをクリックして数秒後に再び使用する方法はありますか？

コード：

// start to automatically cycle slides
var cycleTimer = setInterval(function () {
   $scroll.trigger('next');
}, 450);

// set next/previous buttons as clearInterval triggers 
var $stopTriggers = $('img.right').add('img.left'); // left right

// function to stop auto-cycle
function stopCycle() {
   clearInterval(cycleTimer); 
}
4

1 に答える 1

9

を関数に入れてから、。setIntervalを使用してその関数を呼び出しますsetTimeout()。

setInterval()との違いsetTimeout()はsetInterval()、関数を各間隔で繰り返しsetTimeout()呼び出すのに対し、指定された遅延後に関数を1回だけ呼び出すことです。

以下のコードでは、関数を追加しましたstartCycle()。その関数を呼び出して、サイクルをすぐに開始します。これにより、自動的に開始され、既存のstopCycle()関数内で設定されたタイムアウトから開始されます。

var cycleTimer;

function startCycle() {
   cycleTimer = setInterval(function () {
      $scroll.trigger('next');
   }, 450);
}

// start to automatically cycle slides
startCycle();

// set next/previous buttons as clearInterval triggers 
var $stopTriggers = $('img.right').add('img.left'); // left right

// function to stop auto-cycle
function stopCycle() {
   clearInterval(cycleTimer);
   setTimeout(startCycle, 5000); // restart after 5 seconds
}
于 2012-01-27T05:41:05.943 に答える