當在網站上導航時，如何在瀏覽器跳轉頁面之前使動畫完整完成

Question

我想在導航菜單的我的網頁中使用animate.css。例如，菜單飛出屏幕導航。主要問題是：如何延緩我點擊的頁面加載直到動畫完全完成。現在動畫被切斷，因爲下一頁加載。

$(document).ready(function(){ 
    $('#list').click(function(){ 
     $(this).addClass('animated shake'); 
     window.setTimeout(function(){ 
     $('#list').removeClass('animated shake'); 
     }, 1000); 
    }); 
}); 

Answer 1

jQuery> 1.6中有promise（）。你可以排隊請求進一步等待promise（）。

$("button").on("click", function() { 
    $("p").append("Started..."); 

    $("div").each(function(i) { 
    $(this).fadeIn().fadeOut(1000 * (i+1)); 
    }); 

    $("div").promise().done(function() { 
    $("p").append(" Finished! "); 
    }); 
}); 

http://api.jquery.com/promise/