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

No:40630

31

脱出ゲーム
Developer User18209｜Date and time 24/2/3 20:38:00
Build time 10.179 sec｜Game capacity 2.409KB｜

了解しました。では以下に脱出ゲームの例を示します。

脱出ゲーム

この例では、画面上に「脱出ゲーム」というタイトルが表示され、下には「メッセージ」という領域と「ボタン」というボタンが表示されます。ボタンをクリックすると、ゲームが開始され、メッセージには「ゲームスタート！」と表示されます。また、もう一度ボタンをクリックすると、ゲームが終了し、メッセージには「ゲームクリア！」と表示され、ボタンの背景色が緑色に変わります。このようにして実装された脱出ゲームはスマホでも遊ぶことができ、必ず1枚のhtmlファイルとして実装されています。また、JavaScriptもscriptタグで囲まれ、実行開始されています。絵文字を使用することも可能ですが、この例では使用していませんので、必要に応じて絵文字を追加することができます。

→ 　

0　

0　

[PR]現在の売れ筋ゲームランキング

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

(C)2023 HisashiApp

了解しました。では以下に脱出ゲームの例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>脱出ゲーム</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
    }
    #message {
      margin: 20px;
      font-size: 20px;
    }
    #button {
      padding: 10px 20px;
      font-size: 16px;
      border: none;
      background-color: #007bff;
      color: white;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <h1>脱出ゲーム</h1>
  <p id="message"></p>
  <button id="button">ボタン</button>

<script>
    // ゲームの状態を表す変数
    let gameStarted = false;
    let gameFinished = false;

// メッセージ表示用の要素を取得
    const messageElement = document.getElementById("message");

// ボタンクリック時の処理を設定
    document.getElementById("button").addEventListener("click", function() {
      // ゲームが開始していない場合
      if (!gameStarted) {
        gameStarted = true;
        messageElement.textContent = "ゲームスタート！";
        this.textContent = "ゴール";
      } else {
        // ゲームが終了していない場合
        if (!gameFinished) {
          gameFinished = true;
          messageElement.textContent = "ゲームクリア！";
          this.style.backgroundColor = "green";
        }
      }
    });
  </script>
</body>
</html>
```

この例では、画面上に「脱出ゲーム」というタイトルが表示され、下には「メッセージ」という領域と「ボタン」というボタンが表示されます。
ボタンをクリックすると、ゲームが開始され、メッセージには「ゲームスタート！」と表示されます。
また、もう一度ボタンをクリックすると、ゲームが終了し、メッセージには「ゲームクリア！」と表示され、ボタンの背景色が緑色に変わります。

このようにして実装された脱出ゲームはスマホでも遊ぶことができ、必ず1枚のhtmlファイルとして実装されています。また、JavaScriptもscriptタグで囲まれ、実行開始されています。絵文字を使用することも可能ですが、この例では使用していませんので、必要に応じて絵文字を追加することができます。