如何在jquery转换完成时获得回调

时间:2013-10-18 20:25:41

标签: jquery animation rotation transition

我有一个旋转指针的动画,它按预期工作,但我希望在转换结束时收到回调。这是我的功能..

<script>
$(document).ready( function() {

function AnimateRotate(d){
    $({deg: 0}).animate({deg: d}, {
                duration:1440,
        step: function(now, fx){
            $(".needle").css({
                 transform: "rotate(" + now + "deg)"
            });
        }
    });
}

AnimateRotate(90);

});

</script>

这是我尝试过的,但过渡完成时都不会触发。我究竟做错了什么?

$(".needle").bind('transitionend webkitTransitionEnd oTransitionEnd otransitionend MSTransitionEnd', 
function() { 
         alert( "Finished transition!" ); 
 //do something
});

$(".needle").bind("animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd", 
    function() { 
         alert( "Finished transition!" ); 
    //do something
});

1 个答案:

答案 0 :(得分:0)

使用.animate来电的完整回调。

function AnimateRotate(d){
    $({deg: 0}).animate({deg: d}, {
                duration:1440,
        step: function(now, fx){
            $(".needle").css({
                 transform: "rotate(" + now + "deg)"
            });
        },
        complete: function(){
            console.log("Hello World!");
        }
    });
}

AnimateRotate(90);