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

No:39144

←

Prev Next

→

Fall guys
Developer User17403｜Date and time 24/1/27 0:32:18
Build time 27.59 sec｜Game capacity 5.673KB｜

Script

Fall Guys Game

Use the left and right arrow keys to move the character and avoid the obstacles!

Score: 0

Game Over

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Fall Guys Game</title>
    <style>
        body {
            text-align: center;
        }

#gameCanvas {
            width: 500px;
            height: 500px;
            border: 2px solid black;
            margin: 20px auto;
        }

#score {
            font-size: 20px;
            font-weight: bold;
            margin-bottom: 10px;
        }

#gameOver {
            font-size: 30px;
            font-weight: bold;
            color: red;
            display: none;
        }

#startButton {
            font-size: 24px;
            padding: 10px 20px;
            border: none;
            border-radius: 4px;
            background-color: #4CAF50;
            color: white;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <h1>Fall Guys Game</h1>
    <p>Use the left and right arrow keys to move the character and avoid the obstacles!</p>
    <div id="score">Score: 0</div>
    <div id="gameCanvas"></div>
    <div id="gameOver">Game Over</div>
    <button id="startButton">Start Game</button>

let canvas;
        let ctx;
        let player;
        let obstacles;
        let score;
        let gameInterval;
        let isGameOver;

// Pictograms
        const playerImage = "🤸";
        const obstacleImage = "🚧";

// Initialize Game
        function startGame() {
            canvas = document.getElementById("gameCanvas");
            ctx = canvas.getContext("2d");
            player = { x: canvas.width / 2, y: canvas.height - 30, width: 30, height: 30 };
            obstacles = [];
            score = 0;
            isGameOver = false;

document.getElementById("gameOver").style.display = "none";
            document.getElementById("score").innerHTML = "Score: " + score;

gameInterval = setInterval(updateGame, 20);
            spawnObstacles();
        }

// Update Game State
        function updateGame() {
            clearCanvas();
            movePlayer();
            updateObstacles();
            checkCollisions();
            drawPlayer();
            drawObstacles();
            updateScore();
        }

// Clear Game Canvas
        function clearCanvas() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
        }

// Move Player
        function movePlayer() {
            if (player.x < 0) {
                player.x = 0;
            }
            if (player.x + player.width > canvas.width) {
                player.x = canvas.width - player.width;
            }

if (player.y < canvas.height - player.height) {
                player.y += gravity;
            }

if (isJumping) {
                player.y += jumpForce;
                isJumping = false;
            }
        }

// Control Player Jump
        let isJumping = false;
        document.onkeydown = function (event) {
            if (event.keyCode === 37) {
                player.x -= 10; // Left Arrow Key
            }
            if (event.keyCode === 39) {
                player.x += 10; // Right Arrow Key
            }
            if (event.keyCode === 38 && player.y === canvas.height - player.height) {
                isJumping = true; // Up Arrow Key
            }
        };

// Spawn Obstacles
        function spawnObstacles() {
            setInterval(function () {
                const x = Math.random() * (canvas.width - obstacleWidth);
                const obstacle = { x: x, y: 0, width: obstacleWidth, height: obstacleHeight };
                obstacles.push(obstacle);
            }, spawnInterval);
        }

// Update Obstacles
        function updateObstacles() {
            for (let i = 0; i < obstacles.length; i++) {
                obstacles[i].y += obstacleSpeed;
            }
        }

// Check Collisions
        function checkCollisions() {
            for (let i = 0; i < obstacles.length; i++) {
                if (
                    player.x < obstacles[i].x + obstacles[i].width &&
                    player.x + player.width > obstacles[i].x &&
                    player.y < obstacles[i].y + obstacles[i].height &&
                    player.y + player.height > obstacles[i].y
                ) {
                    endGame();
                    break;
                }
            }
        }

// Draw Player
        function drawPlayer() {
            ctx.font = "30px Arial";
            ctx.fillText(playerImage, player.x, player.y + player.height);
        }

// Draw Obstacles
        function drawObstacles() {
            for (let i = 0; i < obstacles.length; i++) {
                ctx.font = "30px Arial";
                ctx.fillText(obstacleImage, obstacles[i].x, obstacles[i].y + obstacles[i].height);
            }
        }

// Update Score
        function updateScore() {
            score++;
            document.getElementById("score").innerHTML = "Score: " + score;
        }

// End Game
        function endGame() {
            clearInterval(gameInterval);
            isGameOver = true;
            document.getElementById("gameOver").style.display = "block";
        }

// Start Button Event Listener
        document.getElementById("startButton").addEventListener("click", startGame);

// Initial Game Start
        startGame();
    </script>
</body>
</html>