grand slam (baseball)'s game

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

No:12540

173

←

Prev Next

→

grand slam (baseball)
Developer User1006｜Date and time 23/8/19 11:22:02
Build time 17.096 sec｜Game capacity 2.924KB｜

Script

了解です。以下が要件を満たすプログラムの実装例です。

スワイプでホームランを打つ！🚀

このプログラムでは、スワイプを通じてホームランを打つゲームを実装しています。ゲームの開始ボタンをタップすると、スワイプイベントが有効になります。スワイプが右に100以上の距離で行われた場合、ホームランと判定され、結果が表示されます。それ以外の場合はアウトと判定されます。表示された結果の後、再度ゲームを開始するためにはボタンを押す必要があります。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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>
      #message {
        text-align: center;
        font-size: 24px;
        margin-top: 100px;
      }
      #button {
        text-align: center;
        margin-top: 50px;
      }
      #result {
        text-align: center;
        font-size: 30px;
        margin-top: 50px;
      }
    </style>
  </head>
  <body>
    <div id="message">
      スワイプでホームランを打つ！🚀
    </div>
    <div id="button">
      <button onclick="startGame()">ゲーム開始</button>
    </div>
    <div id="result"></div>
    <script>
      let gameStarted = false;
      let swipeStartX;
      let swipeEndX;

function startGame() {
        gameStarted = true;
        document.getElementById("message").style.display = "none";
        document.getElementById("button").style.display = "none";
        document.addEventListener("touchstart", handleTouchStart, false);
        document.addEventListener("touchmove", handleTouchMove, false);
        document.addEventListener("touchend", handleTouchEnd, false);
      }

function handleTouchStart(event) {
        if (!gameStarted) return;
        swipeStartX = event.touches[0].clientX;
      }

function handleTouchMove(event) {
        if (!gameStarted) return;
        swipeEndX = event.touches[0].clientX;
      }

function resetGame() {
        gameStarted = false;
        swipeStartX = null;
        swipeEndX = null;
        document.getElementById("message").style.display = "block";
        document.getElementById("button").style.display = "block";
        document.getElementById("result").textContent = "";
        document.removeEventListener("touchstart", handleTouchStart);
        document.removeEventListener("touchmove", handleTouchMove);
        document.removeEventListener("touchend", handleTouchEnd);
      }
    </script>
  </body>
</html>
```