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

No:30560

Create me battles and magic game
Developer User14858｜Date and time 23/12/22 22:26:16
Build time 19.35 sec｜Game capacity 3.199KB｜

Script

Certainly! Here's a simple battles and magic game implemented as a single HTML file using JavaScript. In this game, you'll control a character and battle enemy creatures using magic attacks. The player will have three different magic spells to choose from. The game will be played on a smartphone. I'll use emoji symbols to represent the pictograms. Enjoy!

Battles and Magic

🧙

🐉

Save the above code in an HTML file (e.g., `game.html`) and open it in a web browser on your smartphone to play the game. Remember to use the attack buttons with the emojis to cast your spells and defeat the enemy creature. Have fun battling and using magic!

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

```html
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Battles and Magic Game</title>
    <style>
        body {
            text-align: center;
            font-size: 2em;
        }
    </style>
</head>

<body>
    <h1>Battles and Magic</h1>
    <div id="battlefield">
        <p id="player">🧙</p>
        <p id="enemy">🐉</p>
    </div>
    <div id="action">
        <button onclick="attack(0)">🔥</button>
        <button onclick="attack(1)">💨</button>
        <button onclick="attack(2)">💧</button>
    </div>

function attack(spellIndex) {
            let spells = ['🔥', '💨', '💧'];
            let spell = spells[spellIndex];

// Player attacks
            player.style.animation = 'attack 1s';
            setTimeout(function () {
                enemy.innerText = spell;
            }, 500);

// Enemy counters
            setTimeout(function () {
                let enemySpellIndex = Math.floor(Math.random() * spells.length);
                let enemySpell = spells[enemySpellIndex];
                player.innerText = enemySpell;
                player.style.animation = 'counter 1s';
            }, 1000);

// Calculate outcome
            setTimeout(function () {
                let outcome = calculateOutcome(spell, enemy.innerText);
                let message;
                if (outcome === 'win') {
                    message = "You defeated the enemy!";
                } else if (outcome === 'lose') {
                    message = "You were defeated!";
                } else {
                    message = "It's a draw!";
                }
                alert(message);
                resetBattle();
            }, 2000);
        }

function calculateOutcome(playerSpell, enemySpell) {
            if (playerSpell === enemySpell) return 'draw';
            if (
                (playerSpell === '🔥' && enemySpell === '💨') ||
                (playerSpell === '💨' && enemySpell === '💧') ||
                (playerSpell === '💧' && enemySpell === '🔥')
            ) {
                return 'win';
            }
            return 'lose';
        }

function resetBattle() {
            player.innerText = '🧙';
            player.style.animation = '';
            enemy.innerText = '🐉';
        }
    </script>
</body>

</html>
```