立即運行2個動畫

Question

我爲兒童創建了一個射擊遊戲，其中數字是從下到上的，他們必須點擊與該問題相匹配的正確答案。

我目前使用此代碼來啓動這一數字從底部移動到頂部

var bWidth = $('#' + id).width(); 
var bHeight = $('#' + id).css('top', '400px').fadeIn(1000).animate({ 
    'top': '-100px' 
}, 7000).fadeOut(1000); 

的事情是當用戶能正確回答這個然後我用另一個動畫來顯示它是正確的，對於相同的錯誤的答案。

$(".character").click(function() { 
    $(this).stop(); 
    if ($(this).hasClass("clock")) { 
     if ($(this).hasClass("up")) { 
      $(this).effect("explode", 300); 
      count += 5; 
     } else if ($(this).hasClass("down")) { 
      $(this).effect("bounce", { 
       times: 2, 
       direction: 'left' 
      }, 300, function() { 
       $(this).slideUp('fast'); 
      }); 
      count -= 5; 
     } 
     $('#timer').text(count); 
    } else { 
     if ($(this).hasClass("wrong")) { 
      $(this).effect("bounce", { 
       times: 2, 
       direction: 'left' 
      }, 300, function() { 
       $(this).slideUp('fast'); 
      }); 
      miss++; 
      attempted++; 
      $("#miss").html("Wrong: " + miss); 
     } else { 
      $(this).effect("explode", 300); 
      hit++; 
      attempted++; 
      $("#hit").html("Right: " + hit); 
      correctlabels(); 
     } 
    } 
}); 

我的問題是，當我點擊的數量存在較大的暫停第二動畫踢之前，有時甚至沒有在所有的工作。

我想知道是否有人能告訴我一個解決方法，讓它順利運行。謝謝！

這裏是一個小提琴的幫助：http://jsfiddle.net/pUwKb/19/

Answer 1

使用queue: false在動畫（）選項：

或