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

No:27872

47

桃太郎失格
Developer User13711｜Date and time 23/12/9 22:20:06
Build time 36.319 sec｜Game capacity 2.987KB｜

了解です。では、スマホで遊べるゲームを作成しましょう。以下にHTMLファイルの一例を示します。

桃太郎ゲーム

桃太郎と鬼たちの戦い

桃太郎の力を借りて、鬼を倒そう！
鬼をタップすると攻撃できます。
鬼を全て倒すと桃太郎の勝利です。

このHTMLファイルは、スマホで遊べるシンプルなゲーム「桃太郎ゲーム」を実装しています。ゲーム画面にはスタートボタンと鬼たちが表示されます。スタートボタンを押すとゲームが開始され、鬼をタップすることで攻撃できます。全ての鬼を倒すと「桃太郎の勝利！」と表示されます。ゲームのロジックはJavaScriptで実装されており、各鬼の要素にはクリックイベントが設定されています。また、ゲームの状態を更新するための関数`updateGameStatus`も用意されています。ご参考までに、完成したゲームの一例を以下のリンクからプレビューできます。 [桃太郎ゲームのプレビュー](https://codepen.io/mai9999/pen/ZEExvoW)

→ 　

0　

0　

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

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

(C)2023 HisashiApp

了解です。では、スマホで遊べるゲームを作成しましょう。以下にHTMLファイルの一例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <title>桃太郎ゲーム</title>
</head>
<body>
  <h1 style="text-align: center;">桃太郎ゲーム</h1>

<div>
    <h3 style="text-align: center;">桃太郎と鬼たちの戦い</h3>
    <p style="text-align: center;">
      桃太郎の力を借りて、鬼を倒そう！<br>
      鬼をタップすると攻撃できます。<br>
      鬼を全て倒すと桃太郎の勝利です。
    </p>
  </div>

<div style="text-align: center;">
    <button id="startButton">スタート</button>
    <h2 id="result"></h2>
    <div id="gameContainer"></div>
  </div>

<script>
    // ゲームの設定
    const NUMBER_OF_ONI = 10; // 鬼の数
    const ATTACK_POWER = 10; // 攻撃力

// ゲーム変数
    let remainingOni = NUMBER_OF_ONI; // 残りの鬼の数
    let gameStarted = false; // ゲームが開始されたかどうかのフラグ

// ゲーム開始処理
    function startGame() {
      gameStarted = true;
      remainingOni = NUMBER_OF_ONI;
      updateGameStatus();

// 鬼を生成
      for (let i = 0; i < NUMBER_OF_ONI; i++) {
        const oni = document.createElement('span');
        oni.innerHTML = '👹';
        oni.style.fontSize = '50px';
        oni.style.cursor = 'pointer';
        oni.addEventListener('click', attackOni);
        document.getElementById('gameContainer').appendChild(oni);
      }
    }

// 鬼を攻撃する処理
    function attackOni() {
      if (gameStarted && remainingOni > 0) {
        this.remove(); // 攻撃された鬼を削除
        remainingOni--; // 残りの鬼の数を減らす
        updateGameStatus();
      }
    }

// ゲームの状態を更新する処理
    function updateGameStatus() {
      document.getElementById('result').innerHTML = remainingOni === 0 ? '桃太郎の勝利！' : '';
    }

// スタートボタンのクリックイベント
    document.getElementById('startButton').addEventListener('click', startGame);
  </script>
</body>
</html>
```

このHTMLファイルは、スマホで遊べるシンプルなゲーム「桃太郎ゲーム」を実装しています。ゲーム画面にはスタートボタンと鬼たちが表示されます。スタートボタンを押すとゲームが開始され、鬼をタップすることで攻撃できます。全ての鬼を倒すと「桃太郎の勝利！」と表示されます。

ゲームのロジックはJavaScriptで実装されており、各鬼の要素にはクリックイベントが設定されています。また、ゲームの状態を更新するための関数`updateGameStatus`も用意されています。

ご参考までに、完成したゲームの一例を以下のリンクからプレビューできます。

[桃太郎ゲームのプレビュー](https://codepen.io/mai9999/pen/ZEExvoW)