如何反覆動畫並不等待？

-1

我試圖讓一些文本出現，並做它的動畫，然後淡出。我讓這部分工作，但我希望它是可重複的，無需等待動畫完成。例如，我在代碼中用按鈕單擊來測試它，並且我希望文本在每次按下按鈕時都執行它的動畫，而無需等待動畫完成。完成後，我應該多次在屏幕上動畫文字。請記住，我不想中斷當前的動畫。如何反覆動畫並不等待？

代碼：

<p id="test" hidden="true">Test</p> 
<button id="random">Random</button> 



$(function() { 
$('#random').click(function(){ 
    minusHealth(); 
}); 

function minusHealth() { 
var health = parseInt($('#health').text()); 

     health = isNaN(health) ? 0 : health - 1; 
     $("#test").removeAttr("hidden"); 
     $("#test").animate({top:'250px'}, 900); 
     $("#test").fadeOut(400); 

    $('#health').text(health); 

} 
});

來源

2014-09-28 Cosmicluck

_「通過單擊按鈕，我希望文字做的動畫每一次我打一次該按鈕沒有等待動畫完成「_，_」我不想中斷當前的動畫「_？乍一看，第一句似乎表示_interrupting_當前正在運行的動畫;第二句_不中斷當前正在運行的動畫？如果可能，可以澄清要求嗎？謝謝 – guest271314 2014-09-28 03:42:46

基本上我想讓動畫在每次按下按鈕時工作，而且我不希望它中斷當前的動畫。所以我希望每次按下按鈕時，「測試」一詞都會變成動畫。如果沒有其他方法，它將無法工作，因爲它會動畫文本並且只能在不中斷動畫的情況下使用一次。 – Cosmicluck 2014-09-28 03:46:52

guest271314例如，如果您查看cookie點擊器，則當您單擊cookie時，文本會變爲動畫。我需要類似的東西。 – Cosmicluck 2014-09-28 03:53:51

嘗試替代.fadeToggle()爲.fadeOut()

$(function() { 
 
$('#random').click(function(){ 
 
    minusHealth(); 
 
}); 
 

 
function minusHealth() { 
 
var health = parseInt($('#health').text()); 
 

 
     health = isNaN(health) ? 0 : health - 1; 
 
     $("#test").removeAttr("hidden"); 
 
     $("#test").animate({top:'250px'}, 900); 
 
     $("#test").fadeToggle(400); 
 

 
    $('#health').text(health); 
 

 
} 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<p id="test" hidden="true">Test</p> 
 
<button id="random">Random</button>

來源

2014-09-28 03:54:26 guest271314

這不是我正在尋找的。描述我想要它做什麼真的很難。我看到許多其他開發人員將它用於遊戲和其他事情。餅乾點擊器做了我想要的東西。 – Cosmicluck 2014-09-28 03:58:13

如何反覆動畫並不等待？

回答

相關問題