jQueryのは、私が持っている新しいアニメーション

Question

を開始する前に、アニメーションを終了します。

$('.p_m').mouseenter(function() { 

    $(this).animate({ 
     marginTop: '10px', 
     marginLeft: '10px', 
     height: '150px', 
     width: '150px' 
    }, 10000); 

}).mouseleave(function() { 

    $(this).animate({ 
     marginTop: '35px', 
     marginLeft: '35px', 
     height: '100px', 
     width: '100px' 
    }, 10000); 
}); 

を私は10000msより'.p_m'迅速クラスを離れるときは、MouseEnterイベントのアニメーションは、私はdivのクラスを離れていてもいっています。

アニメーションをスキップする（マウスを使用する）か、またはそれを10000msに収まるようにすばやく作成することができますか。

Answer 1

.stop()を使用すると、現在のアニメーションが停止します。

$('.p_m').mouseenter(function() { 

    $(this).stop().animate({ 
     marginTop: '10px', 
     marginLeft: '10px', 
     height: '150px', 
     width: '150px' 
    }, 10000); 

}).mouseleave(function() { 

    $(this).stop().animate({ 
     marginTop: '35px', 
     marginLeft: '35px', 
     height: '100px', 
     width: '100px' 
    }, 10000); 
}); 

あなたはアニメーションは、新しいものを開始する前に最後までスキップ2番目の引数としてtrueを渡したい場合。 .stop(true,true)