AI game creator

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

No:43338

←

Prev Next

→

Car racing
Developer User19169｜Date and time 24/2/15 7:39:22
Build time 10.922 sec｜Game capacity 3.064KB｜

Script

Sure! Here's a simple car racing game implemented as a single HTML file using JavaScript:

This code creates a simple car racing game where you control a red car using the left and right arrow keys. Your goal is to avoid the obstacles represented by white blocks that move down the screen. If you collide with an obstacle, it's game over. To restart the game, simply reload the page.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple car racing game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Car Racing Game</title>
  <style>
    #game {
      position: relative;
      width: 400px;
      height: 600px;
      background-color: #333;
    }
    .car {
      position: absolute;
      bottom: 10px;
      width: 50px;
      height: 100px;
      background-color: red;
    }
    .obstacle {
      position: absolute;
      width: 50px;
      height: 50px;
      background-color: #FFF;
    }
  </style>
</head>
<body>
  <div id="game">
    <div class="car"></div>
  </div>

var gameElement = document.getElementById("game");
    var carElement = document.querySelector('.car');
    var carPosition = 0;

function moveLeft() {
      carPosition -= 20;
      if (carPosition < -180) {
        carPosition = -180;
      }
      carElement.style.left = carPosition + "px";
    }

function moveRight() {
      carPosition += 20;
      if (carPosition > 180) {
        carPosition = 180;
      }
      carElement.style.left = carPosition + "px";
    }
    
    function createObstacle() {
      var obstacleElement = document.createElement('div');
      obstacleElement.classList.add('obstacle');
      obstacleElement.style.left = getRandomPosition() + "px";
      gameElement.appendChild(obstacleElement);

var interval = setInterval(function() {
        var obstacleTop = parseInt(window.getComputedStyle(obstacleElement).getPropertyValue("top"));
        obstacleElement.style.top = (obstacleTop + 10) + "px";

if (obstacleTop > 600) {
          gameElement.removeChild(obstacleElement);
          clearInterval(interval);
        } else if (checkCollision(obstacleElement)) {
          gameOver();
        }
      }, 50);
    }

function getRandomPosition() {
      var min = -100;
      var max = 100;
      return Math.floor(Math.random() * (max - min + 1) + min);
    }

function checkCollision(obstacleElement) {
      var carRect = carElement.getBoundingClientRect();
      var obstacleRect = obstacleElement.getBoundingClientRect();
      return !(
        carRect.top > obstacleRect.bottom ||
        carRect.right < obstacleRect.left ||
        carRect.bottom < obstacleRect.top ||
        carRect.left > obstacleRect.right
      );
    }

function gameOver() {
      alert("Game Over!");
      location.reload();
    }

var gameInterval = setInterval(createObstacle, 1000);

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