マスタースパークは避けられるのか？'s game | AI game creator

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

No:15920

181

マスタースパークは避けられるのか？
Developer User4966｜Date and time 23/9/13 20:02:56
Build time 44.33 sec｜Game capacity 3.339KB｜

了解しました。以下に、マスタースパークを避けるゲームのHTMLファイルの一例を示します。

👧

💥

このHTMLファイルでは、プレイヤー（👧）とマスタースパーク（💥）が表示されます。プレイヤーは左右の矢印キーで操作し、マスタースパークを避けることが目的です。マスタースパークは画面上部から下に向かって落ちていきます。プレイヤーがマスタースパークと衝突するとスコアが増え、新たなマスタースパークが出現します。ゲームの仕組みとしては、プレイヤーが操作されると、キーイベントが発生し、プレイヤーの位置が変わります。また、マスタースパークは一定の間隔で設置され、落下する速度と衝突判定も行われます。このプログラムを実行すると、ブラウザ上でゲームが遊べるようになります。スマートフォンでもプレイ可能です。

→ 　

0　

0　

　
　

[PR]現在のフィギュア売れ筋ランキング

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

(C)2023 HisashiApp

了解しました。以下に、マスタースパークを避けるゲームのHTMLファイルの一例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <title>マスタースパーク回避ゲーム</title>
  <style>
    body {
      margin: 0;
      overflow: hidden;
    }
    #player {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-size: 50px;
    }
    #spark {
      position: absolute;
      top: 0;
      left: 0;
      font-size: 80px;
    }
  </style>
</head>
<body>
  <div id="player">👧</div>
  <div id="spark">💥</div>
  <script>
    const player = document.getElementById('player');
    const spark = document.getElementById('spark');
    let score = 0;

function movePlayer(event) {
      const keyCode = event.keyCode;
      if (keyCode === 37) { // Left Arrow
        player.style.transform = `translateX(-10%)`;
      } else if (keyCode === 39) { // Right Arrow
        player.style.transform = `translateX(10%)`;
      }
    }
    document.addEventListener('keydown', movePlayer);

function moveSpark() {
      const windowHeight = window.innerHeight;
      let sparkTop = 0;
      let sparkLeft = Math.random() * (window.innerWidth - 200);
      let sparkInterval = setInterval(() => {
        spark.style.top = `${sparkTop}px`;
        spark.style.left = `${sparkLeft}px`;
        sparkTop += 10;
        if (sparkTop > windowHeight) {
          clearInterval(sparkInterval);
          moveSpark();
        } else if (checkCollision()) {
          clearInterval(sparkInterval);
          score++;
          moveSpark();
        }
      }, 50);
    }
    moveSpark();

function checkCollision() {
      const playerRect = player.getBoundingClientRect();
      const sparkRect = spark.getBoundingClientRect();
      return !(
        playerRect.top > sparkRect.bottom ||
        playerRect.bottom < sparkRect.top ||
        playerRect.left > sparkRect.right ||
        playerRect.right < sparkRect.left
      );
    }

function updateScore() {
      const scoreElement = document.createElement('div');
      scoreElement.textContent = `Score: ${score}`;
      scoreElement.style.position = 'absolute';
      scoreElement.style.top = '10px';
      scoreElement.style.left = '10px';
      scoreElement.style.fontSize = '30px';
      document.body.appendChild(scoreElement);
    }
    updateScore();
  </script>
</body>
</html>
```

このHTMLファイルでは、プレイヤー（👧）とマスタースパーク（💥）が表示されます。
プレイヤーは左右の矢印キーで操作し、マスタースパークを避けることが目的です。
マスタースパークは画面上部から下に向かって落ちていきます。
プレイヤーがマスタースパークと衝突するとスコアが増え、新たなマスタースパークが出現します。

ゲームの仕組みとしては、プレイヤーが操作されると、キーイベントが発生し、プレイヤーの位置が変わります。
また、マスタースパークは一定の間隔で設置され、落下する速度と衝突判定も行われます。

このプログラムを実行すると、ブラウザ上でゲームが遊べるようになります。スマートフォンでもプレイ可能です。