Make a game that a cat chases you and you have to run. If the cat touches the player, player dies's game

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

No:16593

←

Prev Next

→

Make a game that a cat chases you and you have to ..ALL
Developer User7388｜Date and time 23/9/19 17:56:35
Build time 30.616 sec｜Game capacity 3.118KB｜

Script

Sure! Here's a simple game where a cat chases the player and the player needs to run away. The game will be implemented as a single HTML file with JavaScript code enclosed in script tags.

In this game, you control the player using the arrow keys on your smartphone. The blue square represents the player, and the red square represents the cat. The cat will chase the player, and if it touches the player, the player dies and the game ends. You can run this HTML file in a web browser on your smartphone, and the game will be playable.

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

Sure! Here's a simple game where a cat chases the player and the player needs to run away. The game will be implemented as a single HTML file with JavaScript code enclosed in script tags.

```html
<!DOCTYPE html>
<html>
  <head>
    <style>
      canvas {
        border: 1px solid black;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Define player position and size
      var player = {
        x: 200,
        y: 200,
        size: 20,
        speed: 5,
        isAlive: true,
      };

// Define cat position and size
      var cat = {
        x: 100,
        y: 100,
        size: 30,
        speed: 3,
      };

// Handle keyboard input
      window.addEventListener("keydown", function (event) {
        // Move player based on arrow key pressed
        if (event.key === "ArrowUp") {
          player.y -= player.speed;
        } else if (event.key === "ArrowDown") {
          player.y += player.speed;
        } else if (event.key === "ArrowLeft") {
          player.x -= player.speed;
        } else if (event.key === "ArrowRight") {
          player.x += player.speed;
        }
      });

// Game loop
      function gameLoop() {
        // Clear canvas
        ctx.clearRect(0, 0, canvas.width, canvas.height);

// Update player
        if (player.isAlive) {
          // Draw player
          ctx.fillStyle = "blue";
          ctx.fillRect(player.x, player.y, player.size, player.size);

// Update cat position towards the player
          if (cat.x < player.x) {
            cat.x += cat.speed;
          } else if (cat.x > player.x) {
            cat.x -= cat.speed;
          }

if (cat.y < player.y) {
            cat.y += cat.speed;
          } else if (cat.y > player.y) {
            cat.y -= cat.speed;
          }

// Draw cat
          ctx.fillStyle = "red";
          ctx.fillRect(cat.x, cat.y, cat.size, cat.size);

// Check collision with cat
          if (
            player.x < cat.x + cat.size &&
            player.x + player.size > cat.x &&
            player.y < cat.y + cat.size &&
            player.y + player.size > cat.y
          ) {
            // Player dies
            player.isAlive = false;
            alert("Oh no! The cat caught you. Game over!");
          }
        }

// If player is not alive, stop the game
        if (!player.isAlive) {
          return;
        }

// Request next frame
        requestAnimationFrame(gameLoop);
      }

// Start the game loop
      gameLoop();
    </script>
  </body>
</html>
```