魚を操作してでかい学校から逃げる's game

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

No:23828

←

Prev Next

→

魚を操作してでかい学校から逃げる
Developer User11163｜Date and time 23/11/3 22:14:35
Build time 67.567 sec｜Game capacity 2.707KB｜

Script

🐠

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Fish Escape</title>
    <style>
        body {
            overflow: hidden;
            margin: 0;
        }

#fish {
            position: relative;
            font-size: 50px;
        }

#school {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #1E90FF;
            font-size: 100px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

#game-over {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #FF4500;
            font-size: 100px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
    </style>
</head>
<body>
    <div id="fish">🐠</div>

var x = 0;
        var y = 0;
        var speed = 5;
        var isGameOver = false;

function updateFishPosition() {
            if (!isGameOver) {
                fish.style.transform = "translate(" + x + "px, " + y + "px)";
                requestAnimationFrame(updateFishPosition);
            }
        }

function checkCollision() {
            var fishRect = fish.getBoundingClientRect();
            var schoolRect = school.getBoundingClientRect();

if (
                fishRect.left < schoolRect.right &&
                fishRect.right > schoolRect.left &&
                fishRect.top < schoolRect.bottom &&
                fishRect.bottom > schoolRect.top
            ) {
                gameOver.style.display = "block";
                isGameOver = true;
            }
        }

function moveFish(event) {
            if (!isGameOver) {
                switch (event.keyCode) {
                    case 37: // Left arrow key
                        x -= speed;
                        break;
                    case 38: // Up arrow key
                        y -= speed;
                        break;
                    case 39: // Right arrow key
                        x += speed;
                        break;
                    case 40: // Down arrow key
                        y += speed;
                        break;
                }

checkCollision();
            }
        }

updateFishPosition();
        document.addEventListener("keydown", moveFish);
    </script>
</body>
</html>