使用jQuery更改動畫速度

Question

$("a").hover(function(){
    $(this).animate({left: '-500px'}, 'slow');
);

我使用此代碼來動畫鏈接的位置。 我將其以slow動畫速度移至左角。

單擊鏈接后，如何將該動畫的速度更改為fast ？

我們應該得到：

• 鏈接懸停時的slow動畫。
• 單擊時fast 。

問題是，當我們嘗試單擊鏈接時，該鏈接可能已經具有動畫效果。 你怎么看？

謝謝。

Answer 1

$("a").hover(function(){
    $(this).animate({left: '-500px'}, 'slow');
).click(function() {
    $(this).dequeue().animate({left: '-500px'}, 'fast');
});

Answer 2

您可以嘗試：

$("a").click(function(){
    $(this).stop(true).animate({left: '-500px'}, 'fast');
);

（未測試）

Answer 3

使用stop()停止任何已在運行的動畫可能會起作用。

$("a").click(function(){
    $(this).stop()
    $(this).animate({left: '-500px'}, 'fast');
);