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

No:14371

←

Prev Next

→

ドラゴンクエストを作って
Developer User5934｜Date and time 23/9/1 10:12:30
Build time 27.709 sec｜Game capacity 3.768KB｜

Script

了解です。ドラゴンクエスト風のゲームを作成します。以下が実装例です。

ドラゴンクエスト風ゲーム

冒険の始まりです！

上記のコードは、プレイヤーと敵のHPを管理し、攻撃や回復のボタンをクリックすることでゲームが進行します。プレイヤーか敵のどちらかのHPが0以下になると結果が表示されます。スマホで操作することを前提に、ボタンを中央に配置し、タップしやすいデザインにしています。また、ゲームの進行状況をメッセージとして表示しています。なお、絵文字は使用しておりませんが、カスタマイズや拡張を行いたい場合は、コード内に絵文字を追加することで可能です。

←

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>ドラゴンクエスト風ゲーム</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
      background-color: #eaeaea;
      margin: 0;
      padding: 20px;
    }
    #message {
      font-size: 24px;
      margin-bottom: 10px;
    }
    #actions {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 5px;
      margin-top: 20px;
    }
    .action-button {
      font-size: 18px;
      padding: 10px 20px;
      background-color: #007bff;
      color: #fff;
      border: none;
      border-radius: 5px;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <h1>ドラゴンクエスト風ゲーム</h1>
  <div id="message">冒険の始まりです！</div>
  <div id="actions">
    <button class="action-button" onclick="attack()">攻撃</button>
    <button class="action-button" onclick="heal()">回復</button>
  </div>

function attack() {
      var playerDamage = getRandomNumber(10, 20);
      var enemyDamage = getRandomNumber(5, 15);

enemyHP -= playerDamage;
      playerHP -= enemyDamage;

updateMessage(`プレイヤーの攻撃！敵に${playerDamage}のダメージ！`);
      updateMessage(`敵の攻撃！プレイヤーに${enemyDamage}のダメージ！`);

if (playerHP <= 0 && enemyHP <= 0) {
        updateMessage("引き分け！冒険はまだ続きます！");
      } else if (playerHP <= 0) {
        updateMessage("プレイヤーの負け！ゲームオーバー！");
      } else if (enemyHP <= 0) {
        updateMessage("敵の負け！おめでとうございます、冒険は成功しました！");
      }

updateMessage(`プレイヤーの残りHP: ${playerHP}`);
      updateMessage(`敵の残りHP: ${enemyHP}`);
    }

function heal() {
      var playerHeal = getRandomNumber(10, 20);
      var enemyDamage = getRandomNumber(5, 15);

playerHP += playerHeal;
      playerHP -= enemyDamage;

updateMessage(`プレイヤーは回復しました！HPが${playerHeal}回復しました！`);
      updateMessage(`敵の攻撃！プレイヤーに${enemyDamage}のダメージ！`);

updateMessage(`プレイヤーの残りHP: ${playerHP}`);
      updateMessage(`敵の残りHP: ${enemyHP}`);
    }

function updateMessage(message) {
      document.getElementById("message").innerText = message;
    }

function getRandomNumber(min, max) {
      return Math.floor(Math.random() * (max - min + 1)) + min;
    }
  </script>
</body>
</html>
```

上記のコードは、プレイヤーと敵のHPを管理し、攻撃や回復のボタンをクリックすることでゲームが進行します。プレイヤーか敵のどちらかのHPが0以下になると結果が表示されます。

スマホで操作することを前提に、ボタンを中央に配置し、タップしやすいデザインにしています。また、ゲームの進行状況をメッセージとして表示しています。

なお、絵文字は使用しておりませんが、カスタマイズや拡張を行いたい場合は、コード内に絵文字を追加することで可能です。