Red runner you are a man emoji in a red emoji world running from a red emoji monster with red emoji triangles you have to watch out for tap the screen to jump over do not touch the spikes or you have to restart's game

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

No:38457

←

Prev Next

→

Red runner you are a man emoji in a red emoji worl..ALL
Developer User17401｜Date and time 24/1/24 22:29:29
Build time 17.802 sec｜Game capacity 3.58KB｜

Script

Sure! Here's a simple game implementation that meets your requirements:

You can save the above code in a file named "red_runner.html" and open it in a web browser to play the game. Simply tap the screen to make the red runner jump and avoid collision with the red triangles (obstacles) or the red monster. The goal is to achieve a high score by avoiding collisions.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple game implementation that meets your requirements:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Red Runner Game</title>
  <style>
    body {
      margin: 0;
      padding: 0;
      overflow: hidden;
    }

#canvas {
      background-color: red;
      height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 60px;
    }
  </style>
</head>
<body>
  <canvas id="canvas"></canvas>

function initializeGame() {
      canvas = document.getElementById("canvas");
      context = canvas.getContext("2d");

runner = {
        x: 50,
        y: canvas.height / 2,
        width: 60,
        height: 60,
        dy: 0
      };

monster = {
        x: canvas.width - 150,
        y: canvas.height / 2,
        width: 60,
        height: 60,
        speed: 3
      };

obstacles = [];

score = 0;

canvas.addEventListener("click", jumpRunner);
      setInterval(updateGame, 20);
      createObstacle();
    }

function createObstacle() {
      var obstacle = {
        x: canvas.width,
        y: Math.random() * (canvas.height - 100),
        width: 50,
        height: 50
      };

obstacles.push(obstacle);
    }

function updateGame() {
      context.clearRect(0, 0, canvas.width, canvas.height);

// Update runner
      runner.y += runner.dy;

// Update monster
      if (monster.y <= 0 || monster.y >= canvas.height - monster.height)
        monster.speed *= -1;
      monster.y += monster.speed;

// Update obstacles
      for (var i = 0; i < obstacles.length; i++) {
        obstacles[i].x -= 5;

if (collision(runner, obstacles[i])) {
          gameOver();
        }

if (obstacles[i].x + obstacles[i].width <= 0) {
          obstacles.splice(i, 1);
          i--;
          score++;
        }
      }

if (score % 30 === 0 && score !== 0)
        createObstacle();

// Draw runner
      context.fillStyle = "black";
      context.fillRect(runner.x, runner.y, runner.width, runner.height);

// Draw monster
      context.fillStyle = "black";
      context.fillRect(monster.x, monster.y, monster.width, monster.height);

// Draw obstacles
      context.fillStyle = "black";
      for (var i = 0; i < obstacles.length; i++) {
        context.fillRect(
          obstacles[i].x,
          obstacles[i].y,
          obstacles[i].width,
          obstacles[i].height
        );
      }

// Draw score
      context.fillStyle = "white";
      context.font = "20px Arial";
      context.fillText("Score: " + score, 10, 30);
    }

function jumpRunner() {
      runner.dy = -10;
    }

function collision(rect1, rect2) {
      if (
        rect1.x < rect2.x + rect2.width &&
        rect1.x + rect1.width > rect2.x &&
        rect1.y < rect2.y + rect2.height &&
        rect1.y + rect1.height > rect2.y
      ) {
        return true;
      }
      return false;
    }

function gameOver() {
      canvas.removeEventListener("click", jumpRunner);
      alert("Game Over! Your score: " + score);
      location.reload();
    }

initializeGame();
  </script>
</body>
</html>
```