Question

我有一个小型的jquery游戏，其中炮塔在其他已被动画移动穿过场地的div上发射射弹。我的射弹被射到最后一个位置，迎面而来的div就在附近，所以它从来没有击中过。我需要的是一种方法来改变射弹的移动过程，然后它将始终击中目标，因为它跟随它。通过使用下面的方法，我可以收到射弹的当前位置，但我不能修改它作为动画。

$(projectile).animate({"top":Y, "left": X},{duration:500, easing: 'linear',step: function( currentLeft,currentTop ){
 checkforenemies();
},  complete: function() {
    $(projectile).remove();

}});

有没有办法在步骤中修改动画的过程：function？

Answer 1

我想到了一些方法： A）您可以将动画分解为几个步骤：

function step(){
  while ( $(projectile).length > 0 ){ // while projectile exists
    $(projectile).animate({
      "top": getTargetY()/numberOfStepsItTakesToHitIt,
      "left": getTargetX()/numberOfStepsItTakesToHitIt },
      {duration:500, easing: 'linear', complete: function() {
        $(projectile).remove();
      }
    });
    step();
  }
}

B）检查目标是否在每一步上改变了位置，如果是，则停止动画并开始一个新动画：

function step(){
  if (targetMoved && $(projectile).length > 0){
    $(projectile).stop();
    $(projectile).animate({
      "top": getTargetY()/numberOfStepsItTakesToHitIt,
      "left": getTargetX()/numberOfStepsItTakesToHitIt },
      {duration:500, easing: 'linear', step: step, complete: function() {
        $(projectile).remove();
      }
    });
  }
}

C）计算目标轨迹（基于它的位置和速度）并猜测它的未来位置。比在那个地方起火并检查碰撞。

我最喜欢最后一种方法。抛射物轨迹不会弯曲，但它是最复杂的。

P.S。：我没有检查代码，所以它可能包含一些语义（甚至可能是逻辑）错误。

如何在动画时更改Jquery动画课程？

1 个答案: