Little human jumping obstacles to win It take about 60 seconds to get to the top There should be like easy and hard obstacles on his way's game

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

No:51686

150

←

Prev Next

→

Little human jumping obstacles to win It take abo..ALL
Developer User21631｜Date and time 24/3/15 0:49:59
Build time 8.962 sec｜Game capacity 2.388KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームアプリランキング

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

<html>
<head>
    <title>Jumping Game</title>
</head>
<body>
    <canvas id="gameCanvas" width="480" height="320"></canvas>
    <script>
        const canvas = document.getElementById('gameCanvas');
        const ctx = canvas.getContext('2d');

let playerX = 50;
        let playerY = 100;
        let playerVelocityY = 0;
        let playerJumping = false;
      
        let obstacles = [
            { x: 200, y: 150, width: 50, height: 50, speed: 5 },
            { x: 300, y: 200, width: 50, height: 50, speed: 3 }
        ];

function updatePlayer() {
            if(playerJumping) {
                playerVelocityY = -10;
                playerJumping = false;
            }

playerY += playerVelocityY;
            playerVelocityY += 0.5;

if(playerY > 200) {
                playerY = 200;
                playerVelocityY = 0;
            }
        }

function updateObstacles() {
            for(let obstacle of obstacles) {
                obstacle.x -= obstacle.speed;

if(obstacle.x < -obstacle.width) {
                    obstacle.x = 480;
                }
            }
        }

function checkCollision(obstacle) {
            if(playerX < obstacle.x + obstacle.width &&
               playerX + 20 > obstacle.x &&
               playerY < obstacle.y + obstacle.height &&
               playerY + 20 > obstacle.y) {
                return true;
            }

return false;
        }

function gameLoop() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

updatePlayer();
            updateObstacles();

for(let obstacle of obstacles) {
                ctx.fillStyle = 'red';
                ctx.fillRect(obstacle.x, obstacle.y, obstacle.width, obstacle.height);

if(checkCollision(obstacle)) {
                    alert('Game Over! You hit an obstacle.');
                    document.location.reload();
                }
            }

ctx.fillStyle = 'blue';
            ctx.fillRect(playerX, playerY, 20, 20);

requestAnimationFrame(gameLoop);
        }

document.addEventListener('keydown', function(event) {
            if(event.key === ' ' || event.key === 'ArrowUp') {
                playerJumping = true;
            }
        });

gameLoop();
    </script>
</body>
</html>