Merlin The Magic Mouse and Second Banana Jumps All The Platforms In The Sky and The Space's game

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

No:30051

132

←

Prev Next

→

Merlin The Magic Mouse and Second Banana Jumps All..ALL
Developer User14673｜Date and time 23/12/20 10:06:36
Build time 16.639 sec｜Game capacity 4.373KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>Merlin The Magic Mouse & Second Banana</title>
    <style>
        #game-container {
            width: 400px;
            height: 600px;
            background-color: #000;
            position: relative;
            margin: 0 auto;
        }

.player {
            width: 50px;
            height: 50px;
            position: absolute;
            bottom: 0;
            background-color: #fff;
        }

.platform {
            width: 100px;
            height: 20px;
            position: absolute;
            background-color: #00f;
        }
    </style>
</head>
<body>
    <div id="game-container">
        <div id="player" class="player"></div>
        <div id="platform1" class="platform"></div>
        <div id="platform2" class="platform"></div>
        <div id="platform3" class="platform"></div>
        <div id="platform4" class="platform"></div>
    </div>

var playerX = 175;
        var playerY = 550;
        var platformYs = [500, 400, 300, 200];
        var gravity = 0.2;
        var jumpPower = -7;
        var playerSpeed = 3;
        var isJumping = false;
        var isGameOver = false;

// Game Loop
        function gameLoop() {
            if (!isGameOver) {
                movePlayer();
                movePlatforms();
                checkCollisions();
            }
            requestAnimationFrame(gameLoop);
        }

// Move player
        function movePlayer() {
            if (playerX < 0) {
                playerX = 0;
            } else if (playerX > gameContainer.clientWidth - player.clientWidth) {
                playerX = gameContainer.clientWidth - player.clientWidth;
            }
            if (isJumping) {
                playerY += gravity;
            } else {
                playerY -= gravity;
            }
            player.style.left = playerX + "px";
            player.style.top = playerY + "px";
        }

// Move platforms
        function movePlatforms() {
            for (var i = 0; i < platforms.length; i++) {
                if (platformYs[i] > gameContainer.clientHeight) {
                    platformYs[i] = -20;
                    platforms[i].style.left = Math.floor(Math.random() * (gameContainer.clientWidth - platforms[i].clientWidth)) + "px";
                }
                platformYs[i] += playerSpeed;
                platforms[i].style.top = platformYs[i] + "px";
            }
        }

// Check collisions
        function checkCollisions() {
            for (var i = 0; i < platforms.length; i++) {
                if (
                    playerY < platformYs[i] + platforms[i].clientHeight &&
                    playerY + player.clientHeight > platformYs[i]
                ) {
                    if (
                        playerX + player.clientWidth > platforms[i].offsetLeft &&
                        playerX < platforms[i].offsetLeft + platforms[i].clientWidth
                    ) {
                        gameOver();
                    }
                }
            }
        }

// Game Over
        function gameOver() {
            isGameOver = true;
            alert("Game Over!");
        }

// Event Listeners
        document.addEventListener("keydown", function(event) {
            if (event.key === "ArrowLeft") {
                playerX -= playerSpeed;
            } else if (event.key === "ArrowRight") {
                playerX += playerSpeed;
            } else if (event.key === "ArrowUp" && !isJumping) {
                isJumping = true;
                playerY += jumpPower;
            }
        });

document.addEventListener("keyup", function(event) {
            if (event.key === "ArrowUp") {
                isJumping = false;
            }
        });

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