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

No:33338

←

Prev Next

→

スイカゲーム
Developer User15741｜Date and time 24/1/3 17:51:44
Build time 26.096 sec｜Game capacity 2.363KB｜

Script

了解です。以下にスイカゲームのプログラム例を示します。

クリックしてスタート！

このプログラムでは、クリックするとスイカが隠れて新しい位置に表示されるゲームです。ゲームが開始されると「クリックしてスタート！」というメッセージが表示され、スイカをクリックするとスイカが非表示になります。その後、指定された時間（2秒）後にスイカが新しい位置に表示されます。

←

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>
</head>
<body>
  <h1 id="message">クリックしてスタート！</h1>

// スイカをクリックした時の処理
    function sliceWatermelon() {
      // スイカを非表示にする
      watermelon.style.display = "none";

// 新しい位置にスイカを表示する
      const maxWidth = window.innerWidth - watermelon.offsetWidth;
      const maxHeight = window.innerHeight - watermelon.offsetHeight;
      const randomX = Math.floor(Math.random() * maxWidth);
      const randomY = Math.floor(Math.random() * maxHeight);
      watermelon.style.left = randomX + "px";
      watermelon.style.top = randomY + "px";

// スイカを再表示する
      setTimeout(function() {
        watermelon.style.display = "block";
      }, hideTime);
    }

// ゲーム開始時の処理
    function startGame() {
      // ゲーム開始メッセージを非表示にする
      message.style.display = "none";

// スイカ画像を表示する
      watermelon.style.display = "block";
    }

// ページが読み込まれた時にゲーム開始を設定する
    window.onload = function() {
      startGame();
    }
  </script>

// ゲーム開始メッセージ要素を取得
    const message = document.getElementById("message");
  </script>
</body>
</html>
```