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

No:25672

←

Prev Next

→

料理作成ゲーム
Developer User12608｜Date and time 23/11/23 19:27:38
Build time 54.962 sec｜Game capacity 1.897KB｜

Script

了解です。以下に、料理作成ゲームのサンプル実装を示します。

料理作成ゲーム

🍳

このゲームでは、食材を追加するボタンを押すことで料理が進行し、5つの食材が揃うと料理が完成します。進行具合と完成メッセージは画面上部に表示されます。料理の状態は絵文字の数で表現されています。このサンプルでは絵文字を使用していますが、必要に応じて他の絵文字を使用することもできます。また、スマホでの操作にも対応しています。

←

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: 24px;
    }
    #progress {
      font-size: 32px;
      margin-top: 20px;
    }
    #result {
      font-size: 32px;
      margin-top: 20px;
    }
  </style>
</head>
<body>
  <h1>料理作成ゲーム</h1>
  <p id="dish">🍳</p>
  <input type="button" value="食材を追加" onclick="addIngredient()">
  <div id="progress"></div>
  <div id="result"></div>

function addIngredient() {
      ingredients++;
      updateDish();
      checkProgress();
    }

function updateDish() {
      let dish = document.getElementById("dish");
      dish.textContent = "🍳".repeat(ingredients);
    }

function checkProgress() {
      let progressBar = document.getElementById("progress");

if (ingredients < 5) {
        progressBar.textContent = "進行中: "+ ingredients + "/5";
      } else {
        progressBar.textContent = "料理完成！";
        showResult();
      }
    }

function showResult() {
      let resultDiv = document.getElementById("result");
      resultDiv.textContent = "おめでとう！料理が完成しました🎉";
    }
  </script>
</body>
</html>
```

このゲームでは、食材を追加するボタンを押すことで料理が進行し、5つの食材が揃うと料理が完成します。進行具合と完成メッセージは画面上部に表示されます。料理の状態は絵文字の数で表現されています。

このサンプルでは絵文字を使用していますが、必要に応じて他の絵文字を使用することもできます。また、スマホでの操作にも対応しています。