Make a game with a controls to move right left up and down and a objective to reach the flag under 30 seconds's game

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

No:11091

←

Prev Next

→

Make a game with a controls to move right left up..ALL
Developer unknown｜Date and time 23/8/7 21:17:05
Build time 25.478 sec｜Game capacity 3.299KB｜

Script

Sure, here's an example of a simple game implemented in a single HTML file using JavaScript:

In this game, you control a player represented by a blue square. The objective is to reach the flag (represented by a red square) within 30 seconds. You can use the arrow keys on your smartphone to move the player in the corresponding direction (right, left, up, or down). The game ends when you either reach the flag or the time runs out. The remaining time is displayed at the top of the game container.

←

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 game implemented in a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <style>
        #game-container {
            position: relative;
            width: 500px;
            height: 500px;
            border: 1px solid black;
        }
        
        #player {
            position: absolute;
            top: 50px;
            left: 50px;
            width: 50px;
            height: 50px;
            background-color: blue;
        }
        
        #flag {
            position: absolute;
            top: 400px;
            left: 400px;
            width: 50px;
            height: 50px;
            background-color: red;
        }
    </style>
</head>
<body>
    <div id="game-container">
        <div id="player"></div>
        <div id="flag"></div>
    </div>

var timer = null;
    var timeRemaining = 30;

function startGame() {
        document.addEventListener("keydown", movePlayer);
        timer = setInterval(updateTimer, 1000);
    }

function movePlayer(event) {
        var key = event.keyCode;
        var playerRect = player.getBoundingClientRect();
        var gameContainerRect = document.getElementById("game-container").getBoundingClientRect();

// Move right
        if (key === 39 && playerRect.right < gameContainerRect.right) {
            player.style.left = (playerRect.left + 10) + "px";
        }
        // Move left
        else if (key === 37 && playerRect.left > gameContainerRect.left) {
            player.style.left = (playerRect.left - 10) + "px";
        }
        // Move up
        else if (key === 38 && playerRect.top > gameContainerRect.top) {
            player.style.top = (playerRect.top - 10) + "px";
        }
        // Move down
        else if (key === 40 && playerRect.bottom < gameContainerRect.bottom) {
            player.style.top = (playerRect.top + 10) + "px";
        }

checkWin();
    }

function checkWin() {
        var playerRect = player.getBoundingClientRect();
        var flagRect = flag.getBoundingClientRect();

if (playerRect.x === flagRect.x && playerRect.y === flagRect.y) {
            clearInterval(timer);
            document.getElementById("time").innerHTML = "You win!";
            document.removeEventListener("keydown", movePlayer);
        }
    }

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