2017-12-05 14 views
0

私は弧の中で画像を移動しようとしています...羽ばたき鳥の発射装置を考えてください。画像は画面の左下に表示されます。 「起動」すると、起動したときと同じように、画面上を円弧で移動/アニメーション化します。発射体の軌道円弧を計算する

イメージを線形(上と下)軌跡でアニメートすることはできますが、カーブしてドロップを開始する方法を理解することはできません。

画像は画面の左下に配置されます。

left += 10; 
top -= 10; 
$image.animate({left: '' + left + 'px', top: '' + top + 'px' }); 

答えて

1

トラックの速度だけでなく、位置:私が持っているすべての0.01秒を実行setTimeoutメソッド内

const GRAVITY = 2; // acceleration due to gravity, in pixels/tick 
x = 0; 
y = 0; 
deltaX = 10; 
deltaY = -10; 

function tick() { // your setTimeout method 
    x += deltaX; 
    y += deltaY; 
    deltaY += GRAVITY; 
    $image.animate({left: `${x}px`, top: `${y}px` }); 
} 
+0

パーフェクト。ありがとうございました!!! – grabury

関連する問題