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

No:20360

←

Prev Next

→

🐼がご飯を食べる
Developer User8984｜Date and time 23/10/9 6:55:12
Build time 14.048 sec｜Game capacity 2.57KB｜

Script

了解しました。以下に示すHTMLファイルでは、JavaScriptを使用して🐼がご飯を食べるゲームを実装します。スマートフォンで操作できるようにし、絵文字も使用します。

🐼がご飯を食べるゲーム

🐼がおなかすいたよ！あなたの指示でご飯を食べさせよう！

このHTMLファイルをブラウザで開くと、ボタンをクリックすることで🐼の満腹度が増え、満腹度に応じたメッセージが表示されます。また、ランダムな位置に🐼の絵文字が表示され、3秒後に消えるようになっています。これにより、🐼がご飯を食べる様子がわかります。スマートフォンでも正しく動作するはずです。

←

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 {
      text-align: center;
      font-size: 50px;
    }
    button {
      font-size: 30px;
      padding: 10px 20px;
    }
  </style>
</head>
<body>
  <h1>🐼がご飯を食べるゲーム</h1>
  <p>🐼がおなかすいたよ！あなたの指示でご飯を食べさせよう！</p>
  <button id="feedButton">ご飯をあげる</button>
  <p id="resultMessage"></p>

// ご飯をあげるボタンのクリックイベントを設定
    document.getElementById("feedButton").addEventListener("click", function() {
      // 🐼の満腹度を増やす
      hunger++;

// 🐼の絵文字を表示
      displayPanda();

// 満腹度によってメッセージを表示
      if (hunger >= 5) {
        document.getElementById("resultMessage").textContent = "お腹いっぱい！ありがとう！🐼";
      } else if (hunger >= 3) {
        document.getElementById("resultMessage").textContent = "まだまだお腹すいてるよ！🐼";
      } else {
        document.getElementById("resultMessage").textContent = "もっとお腹いっぱいになるよ！🐼";
      }
    });

// 🐼の絵文字を表示する関数
    function displayPanda() {
      // ランダムな位置に🐼の絵文字を表示
      let emoji = document.createElement("div");
      emoji.textContent = "🐼";
      emoji.style.position = "fixed";
      emoji.style.top = Math.floor(Math.random() * window.innerHeight) + "px";
      emoji.style.left = Math.floor(Math.random() * window.innerWidth) + "px";
      document.body.appendChild(emoji);

// 3秒後に絵文字を削除
      setTimeout(function() {
        emoji.remove();
      }, 3000);
    }
  </script>
</body>
</html>
```