jquery - CSS3 Bounce 然后转到链接

Question

我想制作一个 img 反弹，然后在动画准备好后，它将导航到我正在使用的 href :target with -webkit-animation:bounce .6s 6 alternate ease-out;

并且在使用动画后延迟链接（但它也延迟了 :target）

$('.footer a').click(function(e) {
            var href = $(this).attr('href');
            e.preventDefault();
            setTimeout(function() { window.location.href = href; }, 3000 );  {   
            };
        });

任何想法如何播放动画然后转到页面？

Answer 1

既然你提到-webkit-animation了，你可以使用这个webkitAnimationEnd事件：

$('.footer a').bind('webkitTransitionEnd', function(e) {
    var href = $(this).attr('href');
    setTimeout(function() { window.location.href = href; }, 3000 );
});

Answer 2

单击添加类女巫后将使图像反弹。

$('#item').on('click', function(e){
    e.preventDefault();
    $(this).addClass('bounce');
    //other stuff
    //timeout as you do. Becouse you know how long animation is
})