AI game creator

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

No:38003

←

Prev Next

→

Bike Racing games.
Developer User17050｜Date and time 24/1/22 4:18:21
Build time 10.931 sec｜Game capacity 4.093KB｜

Script

Sure! Here's an example of a simple bike racing game implemented as a single HTML file using JavaScript and enclosed in script tags:

This code will create a bike racing game where you need to avoid obstacles by moving the bike left or right using the arrow keys. The game will end if the bike collides with any obstacle. The game is designed to be played on a smartphone, and pictograms can be added as background images for the bike and obstacles if desired. Note: The code provided is a basic example and can be expanded upon to add more features, levels, and graphics as per your requirements.

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

Sure! Here's an example of a simple bike racing game implemented as a single HTML file using JavaScript and enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Bike Racing Game</title>
    <style>
        #game-container {
            width: 100%;
            height: 500px;
            background-color: lightgray;
            position: relative;
        }

#bike {
            width: 100px;
            height: 50px;
            background-color: red;
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
        }

#obstacle {
            width: 100px;
            height: 50px;
            background-color: green;
            position: absolute;
        }
    </style>
</head>
<body>
    <div id="game-container">
        <div id="bike"></div>
    </div>

// Function to move the bike left or right
        function moveBike(event) {
            if (!gameOver) {
                if (event.keyCode === 37) { // Left arrow key
                    var leftPos = parseInt(bike.style.left);
                    if (leftPos > 0) {
                        bike.style.left = (leftPos - 10) + "px";
                    }
                } else if (event.keyCode === 39) { // Right arrow key
                    var leftPos = parseInt(bike.style.left);
                    if (leftPos < gameContainer.offsetWidth - bike.offsetWidth) {
                        bike.style.left = (leftPos + 10) + "px";
                    }
                }
            }
        }

// Function to create a new obstacle
        function createObstacle() {
            if (!gameOver) {
                obstacle = document.createElement("div");
                obstacle.id = "obstacle";
                obstacle.style.left = Math.random() * (gameContainer.offsetWidth - 100) + "px";
                gameContainer.appendChild(obstacle);

// Move the obstacle down
                var obstacleInterval = setInterval(function() {
                    if (!gameOver) {
                        obstacle.style.top = (parseInt(obstacle.style.top) + 10) + "px";

// Check collision
                        if (checkCollision()) {
                            gameOver = true;
                            clearInterval(obstacleInterval);
                            alert("Game over!");
                        }

// Remove obstacle when it goes out of the game container
                        if (parseInt(obstacle.style.top) > gameContainer.offsetHeight) {
                            gameContainer.removeChild(obstacle);
                        }
                    }
                }, 50);
            }
        }

// Function to check collision between bike and obstacle
        function checkCollision() {
            var bikeRect = bike.getBoundingClientRect();
            var obstacleRect = obstacle.getBoundingClientRect();

return (
                bikeRect.top < obstacleRect.bottom &&
                bikeRect.bottom > obstacleRect.top &&
                bikeRect.left < obstacleRect.right &&
                bikeRect.right > obstacleRect.left
            );
        }

// Start the game
        window.addEventListener("keydown", moveBike);
        setInterval(createObstacle, 1000);
    </script>
</body>
</html>
```

Note: The code provided is a basic example and can be expanded upon to add more features, levels, and graphics as per your requirements.