在网站上导航时，如何在浏览器跳转页面之前使动画完全完成

Question

我想在我的网页上使用animation .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/