jQueryでアニメーションを停止する方法、最初にアニメーションが終了したら

Question

私は自動スライダアニメーションで助けが必要です。私の質問は、ホバリングイベントでアニメーションを停止する方法ですが、別の要素のアニメーションが完全に終わった。

私は、コードのこの部分を持っている：

$(function(){ 

    var current_slide=1; 
    var set_time=2500; 

    $('span').css({top:'300px'}); 

    $.timer(6000,function(timer){ 
     switch(current_slide){ 
     case 1: 
      $('span').css({top:'350px'}); 
      $('#slideshow').stop().animate({left:'-960px',top:'0px'},{easing:'easeOutBack',duration:set_time}); 
      current_slide=2; 
      $('span').delay(2500).animate({top:'300px'}); 
      break; 
     case 2: 
      $('span').css({top:'350px'}); 
      $('#slideshow').stop().animate({left:'-1920px',top:'0px'},{easing:'easeOutBack',duration:set_time}); 
      current_slide=3; 
      $('span').delay(2500).animate({top:'300px'}); 
      break; 
     case 3: 
      $('span').css({top:'350px'}); 
      $('#slideshow').stop().animate({left:'-2880px',top:'0px'},{easing:'easeOutBack',duration:set_time}); 
      current_slide=4; 
      $('span').delay(2500).animate({top:'300px'}); 
      break; 

     case 4: 
      $('span').css({top:'350px'}); 
      $('#slideshow').stop().animate({left:'0px',top:'0px'},{easing:'easeOutExpo',duration:set_time}); 
      current_slide=1; 
      $('span').delay(2500).animate({top:'300px'}); 
      break; 
     } 

     timer.reset(12000); 
    }); 

    $("#slideshow").hover(function(){ 
     $(this).stop(true,true); 
    }); 
}); 

トラブルは、私は、スライダーにカーソルを合わせると、そのアニメーションはほとんど、突然（終わりにジャンプ）が停止し、私はキューを使用する必要があることugly.Mayです.stop（）の前、またはこのようなもの。 ここに良い例があります：http://www.sevtopolishotel.com/ Tnx in advance！あなたが「jumpToEnd」の引数を渡すことができるということが書かれているhttp://api.jquery.com/stop/

：ここ

Answer 1

：

var isHovered = false; 
$("#slideshow").hover(function(e){ 
    isHovered = e.type == 'mouseenter'; 
}); 

そこから、限りスライドショーを推移しているとして、タイマーをスキップすることを意味しており、if(!isHovered) { ... }であなたのスイッチ全体をラップすることは可能であろうすぐ次のタイムアウトを設定するだけです。

Answer 2

は.stop（）のドキュメントです。その引数がfalseの場合、アニメーションは終了するまで続きます。あなたのコードは次のようになります：

$("#slideshow").hover(function(){ 
      $(this).stop(true,false); 
    }); }); 

Answer 3

タイマーへの参照を保持できます。アニメーションを停止するのではなく、アニメーションをスケーリングしているタイマーをクリアするだけです。現在のアニメーションは進行しますが、再び実行する予定はありません。 あなたはこの

vat timer=setTimeout(animation_function, delay); 
//to stop later 
clearTimeOut(timer); 

を行うことができますが、私はあなたがまだあなたの$ .timerプラグインが文書をチェックし、再び実行を停止するための明確な方法を持っている必要がありjqueryのタイマープラグインを使用していると思うのsetTimeoutはJavaScriptを使用している場合。

これを見ると、Postはほぼ同じ問題です。あなたはこのようにホバー状態を追跡することができ