2 つのスプライトを互いに対戦させる基本的なレーサーを作成しようとしています。少し調整した後、レーサーを低速で右に 550 ピクセル移動させました。
私のレーサーとレースを可能にするボタンがあります
<center><button id="race">Race!!</button></center>
<div class="kimo"><img id="kimo" src="images/kimo.gif" alt="Kimo" height="80"></div>
<div class="kahuna"><img id="kahuna" src="images/kahuna.gif" alt="Kahuna" height="80"></div>
それらをアニメーション化するスクリプトは次のとおりです
<script>
$("#race").click(function(){
$(".kimo").animate({"left": "+=550px"}, "slow");
$(".kahuna").animate({"left": "+=550px"}, "slow");
});
</script>
ここで速度は明らかに「遅い」ですが、ボタンがクリックされるたびにランダムな速度を生成し、アニメーションを1回だけ使用したいと考えています。のように、レーサーは合計 550px 移動します。
私が達成しなければならないその他のこと: 550px の終わりに最初に到達した人は誰でも、キモまたはカフナのどちらかが勝者であると宣言するテキストが表示されます。
どんな助けでも大歓迎です。