十字キーで操作できる、ジャンプアクションゲーム（アスレチック）'s game

Click here for free DL of the app version that can save data.

No:16027

←

Prev Next

→

十字キーで操作できる、ジャンプアクションゲーム（アスレチック）
Developer はにわ｜Date and time 23/9/15 7:41:01
Build time 25.7 sec｜Game capacity 2.543KB｜

Script

了解です。以下に十字キーで操作できるジャンプアクションゲームの実装例を示します。

このプログラムでは、ウェブページを開くと画面上に赤い円（プレイヤー）が表示されます。十字キーの左右でプレイヤーの位置が変わり、上キーでジャンプします。ジャンプの高さや移動の速さを変える場合は、`jump()`関数と`fall()`関数内の値を調整してください。また、このプログラムでは壁や障害物は考慮されていませんので、必要に応じて追加する必要があります。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

Click here for free DL of the app version that can save data.

了解です。以下に十字キーで操作できるジャンプアクションゲームの実装例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>ジャンプアクションゲーム</title>
  <style>
    #player {
      position: absolute;
      top: 0;
      left: 0;
      width: 50px;
      height: 50px;
      background-color: red;
      border-radius: 50%;
    }
  </style>
</head>
<body>
  <div id="player"></div>

player.style.transform = `translate(${positionX}px, ${positionY}px)`;
      }

function jump() {
        let jumpCount = 0;
        const jumpInterval = setInterval(function() {
          positionY -= 5;
          player.style.transform = `translate(${positionX}px, ${positionY}px)`;
          jumpCount++;

if (jumpCount === 20) {
            clearInterval(jumpInterval);
            fall();
          }
        }, 20);
      }

function fall() {
        let fallCount = 0;
        const fallInterval = setInterval(function() {
          positionY += 5;
          player.style.transform = `translate(${positionX}px, ${positionY}px)`;
          fallCount++;

if (fallCount === 20) {
            clearInterval(fallInterval);
            isJumping = false;
            positionY = 0;
            player.style.transform = `translate(${positionX}px, ${positionY}px)`;
          }
        }, 20);
      }

document.addEventListener("keydown", handleKeyDown);
    });
  </script>
</body>
</html>
```

このプログラムでは、ウェブページを開くと画面上に赤い円（プレイヤー）が表示されます。十字キーの左右でプレイヤーの位置が変わり、上キーでジャンプします。

ジャンプの高さや移動の速さを変える場合は、`jump()`関数と`fall()`関数内の値を調整してください。また、このプログラムでは壁や障害物は考慮されていませんので、必要に応じて追加する必要があります。