goi goi (three-stringed Japanese fiddlehead)'s game

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

No:9470

235

←

Prev Next

→

goi goi (three-stringed Japanese fiddlehead)
Developer anonymous｜Date and time 23/7/25 2:39:42
Build time 31.823 sec｜Game capacity 4.099KB｜

Script

了解しました。以下にスマホ操作を前提とした完成したゲームを作成しました。プレーヤーは絵文字のキャラクターを操作して、障害物を避けながらゴールを目指すゲームです。

🙂

🔴

🏁

上記のコードは、以下の絵文字を使ったゲームです。 - 🙂: プレーヤーのキャラクター - 🔴: 障害物 - 🏁: ゴールプレーヤーは「↑」キーで上に移動し、「↓」キーで下に移動します。障害物にぶつかるとゲームオーバーになり、ゴールに到達するとクリアです。

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
<title>Emoji Game</title>
<style>
    #player {
        font-size: 50px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    #obstacle {
        font-size: 50px;
        position: fixed;
        top: 50%;
        left: 100%;
        animation: obstacleMove linear infinite;
        animation-duration: 2s;
    }
    #goal {
        font-size: 50px;
        position: fixed;
        top: 50%;
        left: 100%;
        animation: goalMove linear infinite;
        animation-duration: 5s;
    }
    
    @keyframes obstacleMove {
        0% {
            left: 100%;
        }
        100% {
            left: -50px;
        }
    }
    @keyframes goalMove {
        0% {
            left: 100%;
        }
        100% {
            left: -50px;
        }
    }
</style>
</head>
<body>
    <div id="player">🙂</div>
    <div id="obstacle">🔴</div>
    <div id="goal">🏁</div>

function moveUp() {
            let topPosition = parseInt(
                window.getComputedStyle(player).getPropertyValue('top')
            );
            if (topPosition > 0) {
                player.style.top = `${topPosition - 10}px`;
            }
        }

function moveDown() {
            let topPosition = parseInt(
                window.getComputedStyle(player).getPropertyValue('top')
            );
            if (topPosition < window.innerHeight - 50) {
                player.style.top = `${topPosition + 10}px`;
            }
        }

const gameInterval = setInterval(() => {
            const playerLeft = parseInt(
                window.getComputedStyle(player).getPropertyValue('left')
            );
            const obstacleLeft = parseInt(
                window.getComputedStyle(obstacle).getPropertyValue('left')
            );
            const goalLeft = parseInt(
                window.getComputedStyle(goal).getPropertyValue('left')
            );
            const obstacleTop = parseInt(
                window.getComputedStyle(obstacle).getPropertyValue('top')
            );
            const goalTop = parseInt(
                window.getComputedStyle(goal).getPropertyValue('top')
            );

if (playerLeft < obstacleLeft + 60 &&
                playerLeft + 60 > obstacleLeft &&
                playerTop < obstacleTop + 50 &&
                playerTop + 50 > obstacleTop
            ) {
                isGameOver = true;
                clearInterval(gameInterval);
                alert('Game Over!');
            }

if (playerLeft < goalLeft + 60 &&
                playerLeft + 60 > goalLeft &&
                playerTop < goalTop + 50 &&
                playerTop + 50 > goalTop
            ) {
                isGameOver = true;
                clearInterval(gameInterval);
                alert('Congratulations, you won!');
            }
        }, 10);
    </script>
</body>
</html>
```

上記のコードは、以下の絵文字を使ったゲームです。
- 🙂: プレーヤーのキャラクター
- 🔴: 障害物
- 🏁: ゴール

プレーヤーは「↑」キーで上に移動し、「↓」キーで下に移動します。障害物にぶつかるとゲームオーバーになり、ゴールに到達するとクリアです。