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

No:7575

1423

←

Prev Next

→

Hololive
Developer User4062｜Date and time 23/7/8 22:17:57
Build time 14.49 sec｜Game capacity 3.16KB｜

Script

了解しました。以下にサンプルのゲームを作成します。

Emoji RPG

👊

🛡️

このプログラムでは、「Emoji RPG」というタイトルのゲームを作成しています。プレイヤーと敵の体力を表す絵文字が表示されており、プレイヤーは攻撃(👊)ボタンをクリックして敵にダメージを与え、敵は防御(🛡️)ボタンをクリックしてプレイヤーの攻撃を防ぎます。お互いの体力がなくなるとゲームが終了し、結果が表示されます。このゲームは、必要な処理が実行されていることやスマホで操作可能なことを確認してください。実際にブラウザで開いて遊ぶこともできます。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下にサンプルのゲームを作成します。

```html
<!DOCTYPE html>
<html>
<head>
    <title>Emoji RPG</title>
    <style>
        body {
            font-size: 48px;
            text-align: center;
        }
        .emoji {
            display: inline-block;
            cursor: pointer;
            padding: 10px;
        }
        .player {
            font-size: 72px;
            animation: playerAnimation 1s infinite alternate;
        }
        .enemy {
            font-size: 72px;
            animation: enemyAnimation 1s infinite alternate;
        }
        @keyframes playerAnimation {
            from { transform: scale(1); }
            to { transform: scale(1.2); }
        }
        @keyframes enemyAnimation {
            from { transform: scale(1); }
            to { transform: scale(0.8); }
        }
    </style>
</head>
<body>
    <h1>Emoji RPG</h1>
    <div>
        <div class="emoji player" onclick="attack()">👊</div>
        <div class="emoji enemy" onclick="block()">🛡️</div>
    </div>
    
    <script>
        var playerHealth = 100;
        var enemyHealth = 100;
        
        function attack() {
            var damage = Math.floor(Math.random() * 10) + 1;
            enemyHealth -= damage;
            
            if (enemyHealth <= 0) {
                endGame("You win!");
            } else {
                updateHealth();
                enemyAttack();
            }
        }
        
        function block() {
            var blockAmount = Math.floor(Math.random() * 5) + 1;
            playerHealth += blockAmount;
            
            updateHealth();
            enemyAttack();
        }
        
        function enemyAttack() {
            var damage = Math.floor(Math.random() * 10) + 1;
            playerHealth -= damage;
            
            if (playerHealth <= 0) {
                endGame("Game over");
            } else {
                updateHealth();
            }
        }
        
        function updateHealth() {
            document.getElementsByClassName("player")[0].innerText = "💗 " + playerHealth;
            document.getElementsByClassName("enemy")[0].innerText = "💗 " + enemyHealth;
        }
        
        function endGame(message) {
            document.getElementsByClassName("player")[0].innerText = message;
            document.getElementsByClassName("enemy")[0].style.display = "none";
        }
        
        updateHealth();
    </script>
</body>
</html>
```

このプログラムでは、「Emoji RPG」というタイトルのゲームを作成しています。プレイヤーと敵の体力を表す絵文字が表示されており、プレイヤーは攻撃(👊)ボタンをクリックして敵にダメージを与え、敵は防御(🛡️)ボタンをクリックしてプレイヤーの攻撃を防ぎます。

お互いの体力がなくなるとゲームが終了し、結果が表示されます。

このゲームは、必要な処理が実行されていることやスマホで操作可能なことを確認してください。実際にブラウザで開いて遊ぶこともできます。