スネークゲーム通常のスネークゲームに加え、敵のスネークが出現します。プレイヤーから敵に触れてしまうとゲームオーバーですが、反面、敵からプレイヤーに触れると、敵を倒すことが出来ます。's game

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

No:4949

2401

←

Prev Next

→

スネークゲーム通常のスネークゲームに加え、敵のスネークが出現します。プレイヤーから敵に触..ALL
Developer もちきなこ｜Date and time 23/6/29 1:31:09
Build time 31.385 sec｜Game capacity 3.066KB｜

Script

了解です。スネークゲームを作成します。以下が実装例です。

このコードは、HTMLファイルとして実装されたスネークゲームです。画面上にプレイヤーと敵が表示され、矢印キーでプレイヤーを操作します。プレイヤーと敵が接触することで、敵を倒すかゲームオーバーとなります。

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

了解です。スネークゲームを作成します。以下が実装例です。

```html
<!DOCTYPE html>
<html>
  <head>
    <title>スネークゲーム</title>
    <style>
      #game-area {
        width: 400px;
        height: 400px;
        border: 1px solid black;
        position: relative;
      }

.snake {
        width: 20px;
        height: 20px;
        background-color: green;
        position: absolute;
      }

.enemy {
        width: 20px;
        height: 20px;
        background-color: red;
        position: absolute;
      }
    </style>
  </head>
  <body>
    <div id="game-area"></div>
    <script>
      // 各要素の初期位置
      const playerSize = 20; // プレイヤーサイズ
      const initialPlayerX = 0; // プレイヤーの初期X座標
      const initialPlayerY = 0; // プレイヤーの初期Y座標
      const initialEnemyX = 200; // 敵の初期X座標
      const initialEnemyY = 200; // 敵の初期Y座標

// ゲームオーバーフラグ
      let gameOver = false;

// プレイヤー要素
      const player = document.createElement("div");
      player.className = "snake";
      player.style.left = initialPlayerX + "px";
      player.style.top = initialPlayerY + "px";

// 敵要素
      const enemy = document.createElement("div");
      enemy.className = "enemy";
      enemy.style.left = initialEnemyX + "px";
      enemy.style.top = initialEnemyY + "px";

// ゲームエリア要素
      const gameArea = document.getElementById("game-area");
      gameArea.appendChild(player);
      gameArea.appendChild(enemy);

// 移動処理
      document.addEventListener("keydown", function (event) {
        if (gameOver) return;

const keyName = event.key;
        const playerLeft = parseInt(player.style.left);
        const playerTop = parseInt(player.style.top);

if (keyName === "ArrowUp") {
          player.style.top = playerTop - playerSize + "px";
        } else if (keyName === "ArrowDown") {
          player.style.top = playerTop + playerSize + "px";
        } else if (keyName === "ArrowLeft") {
          player.style.left = playerLeft - playerSize + "px";
        } else if (keyName === "ArrowRight") {
          player.style.left = playerLeft + playerSize + "px";
        }

// 当たり判定
        if (
          playerLeft === parseInt(enemy.style.left) &&
          playerTop === parseInt(enemy.style.top)
        ) {
          enemy.style.display = "none"; // 敵を倒す
        } else if (
          playerLeft === initialEnemyX &&
          playerTop === initialEnemyY
        ) {
          gameOver = true;
          alert("ゲームオーバー");
        }
      });
    </script>
  </body>
</html>
```