アニメーションを一時停止する

Question

表示する画像を指定するdata-slidesプロパティを持つページの各divを通過する次のコードがあります。私が何をしたいか

(function($) { 
'use strict'; 
$('[data-slides]').each(function(){ 
     var $slides = $(this); 
     var images = $slides.data('slides'); 
     var count = images.length; 
     var number = 0; 
     var slideshow = function() { 
      $slides 
       .css('background-image', 'url("' + images[number%count] + '")') 
       .show(0, function() { 
        setTimeout(slideshow, 3500); 
       }); 
       number++; 
     }; 

     slideshow(); 
    }); 
}(jQuery)); 

アニメーション固有の要素、そして再びそのスライドショーのアニメーションを開始し、その後、別のボタンを一時停止ボタンを持っている：それは、内外にそれらをフェージングにより、ループ内の異なる画像をアニメーション化します。どうやってやるの？ありがとう！フラッシュサンダーからの提案を使用して

EDIT

は、私が一時停止することができ、別のタイマーでそれを更新しました：これは動作します

function Timer(callback, delay) { 
    var timerId, start, remaining = delay; 

    this.pause = function() { 
     window.clearTimeout(timerId); 
     remaining -= new Date() - start; 
    }; 

    this.resume = function() { 
     start = new Date(); 
     window.clearTimeout(timerId); 
     timerId = window.setTimeout(callback, remaining); 
    }; 

    this.resume(); 
} 

function runSlideshow(div){ 
    var $slides = div; 
    var images = $slides.data('slides'); 
    var count = images.length; 
    var number = 0; 
    this.slideshow = function() { 
     $slides 
      .css('background-image', 'url("' + images[number%count] + '")') 
      .show(0, function() { 
       timer.resume(); 
      }); 
      number++; 
    }; 
    var timer = new Timer(this.slideshow, 3500); 

    this.slideshow(); 
} 

(function($) { 
    'use strict'; 
    $('[data-slides]').each(function() { 
      var run = new runSlideshow($(this)); 
      run.slideshow(); 
    }); 
}(jQuery)); 

、しかし、私のことができるようにする必要がありますそれを一時停止できるように$('[data-slides]')のいずれかからタイマーにアクセスしてください。どうやって？

Answer 1

function Timer(callback, delay) { 
    var timerId, start, remaining = delay; 

    this.pause = function() { 
     window.clearTimeout(timerId); 
     remaining -= new Date() - start; 
    }; 

    this.resume = function() { 
     start = new Date(); 
     window.clearTimeout(timerId); 
     timerId = window.setTimeout(callback, remaining); 
    }; 

    this.resume(); 
} 

var timer = new Timer(function() { 
    alert("Done!"); 
}, 1000); 

timer.pause(); 
// Do some stuff... 
timer.resume(); 

クレジットはTim Downです。