A 39 mb game obstacle runner's game

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

No:49982

←

Prev Next

→

A 39 mb game obstacle runner
Developer User21202｜Date and time 24/3/7 7:09:11
Build time 8.392 sec｜Game capacity 2.575KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Obstacle Runner Game</title>
<style>
  body {
    margin: 0;
    padding: 0;
    overflow: hidden;
  }
  #player {
    width: 50px;
    height: 50px;
    background-color: blue;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }
  .obstacle {
    width: 30px;
    height: 30px;
    background-color: red;
    position: absolute;
  }
</style>
</head>
<body>
<div id="player"></div>
<script>
  const player = document.getElementById("player");
  let playerPosition = 50;
  let score = 0;
  let gameSpeed = 10;
  let gameLoop;

function createObstacle() {
    const obstacle = document.createElement("div");
    obstacle.classList.add("obstacle");
    obstacle.style.bottom = "100%";
    obstacle.style.left = Math.floor(Math.random() * window.innerWidth) + "px";
    document.body.appendChild(obstacle);

moveObstacle(obstacle);
  }

function moveObstacle(obstacle) {
    const obstacleInterval = setInterval(() => {
      const playerRect = player.getBoundingClientRect();
      const obstacleRect = obstacle.getBoundingClientRect();

if (
        playerRect.top <= obstacleRect.bottom &&
        playerRect.right >= obstacleRect.left &&
        playerRect.left <= obstacleRect.right
      ) {
        endGame();
      }

if (parseInt(obstacle.style.bottom) < 0) {
        increaseScore();
        obstacle.remove();
        clearInterval(obstacleInterval);
      } else {
        obstacle.style.bottom = parseInt(obstacle.style.bottom) - 1 + "px";
      }
    }, gameSpeed);
  }

function increaseScore() {
    score++;
    console.log("Score: ", score);
  }

function endGame() {
    clearInterval(gameLoop);
    alert("Game Over! Your score: " + score);
    resetGame();
  }

function resetGame() {
    playerPosition = 50;
    score = 0;
    gameSpeed = 10;
    document.querySelectorAll(".obstacle").forEach(obstacle => obstacle.remove());
    gameLoop = setInterval(() => {
      createObstacle();
    }, 1000);
  }

gameLoop = setInterval(() => {
    createObstacle();
  }, 1000);

setInterval(() => {
    player.style.left = playerPosition + "px";
  }, 100);

</script>
</body>
</html>
```