动画结束时执行动画

execute animation when animation ends

本文关键字:动画 执行 结束      更新时间:2023-09-26

我想在"动画"动画结束时执行"翻转"动画。我希望我创造的鱼将开始向左移动,然后进行翻转,然后再次向右游......

这是小提琴链接: http://jsfiddle.net/TxC5y/7/

function anim() {
    $('.fish_wrap').animate({
     "left": "-90px"}, 5000);
}
anim();
function flip() {
      $('.fish_wrap').transition({
      perspective: '100px',
      rotateY: '180deg'
});
}
flip();

您可以向 .animate 添加一个回调,该回调在完成时运行:

function anim() {
    $('.fish_wrap').animate({
     "left": "-90px"}, 5000, flip);
}

.transition的回调语法略有不同:

function flip() {
    $('.fish_wrap').transition({
      perspective: '100px',
      rotateY: '180deg',
      complete: back            // reverse the animation
    });
}

小提琴

在 jQuery animate 调用中使用 complete 回调

function anim(callWhenDone) {
    $('.fish_wrap').animate({"left": "-90px"}, 5000, callWhenDone);
}
anim(flip);
function flip() {
      $('.fish_wrap').transition({
      perspective: '100px',
      rotateY: '180deg'
});
}