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

No:10106

1280

←

Prev Next

→

watermelon
Developer User4479｜Date and time 23/7/29 2:54:01
Build time 14.882 sec｜Game capacity 1.852KB｜

Script

スイカゲーム

スワイプしてスイカを割ってください！

🍉

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>スイカゲーム</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
  <h1>スイカゲーム</h1>
  <p id="message">スワイプしてスイカを割ってください！</p>
  <div id="watermelon" style="font-size: 100px;">🍉</div>

// タッチイベントの初期位置を保存する変数
    var touchStartX = 0;
    var touchStartY = 0;

// スイカ割りの関数
    function sliceWatermelon(event) {
      // タッチ開始時の位置を取得
      touchStartX = event.changedTouches[0].clientX;
      touchStartY = event.changedTouches[0].clientY;
    }

// スイカ割りの結果を表示する関数
    function showResult(event) {
      // タッチ終了時の位置を取得
      var touchEndX = event.changedTouches[0].clientX;
      var touchEndY = event.changedTouches[0].clientY;

// タッチの移動距離を計算
      var distanceX = touchEndX - touchStartX;
      var distanceY = touchEndY - touchStartY;

// タッチした距離が一定以上であればスイカを割る
      if (Math.abs(distanceX) >= 100 && Math.abs(distanceY) <= 50) {
        watermelon.textContent = "🍉✂️";
        document.getElementById("message").textContent = "スイカを割りました！おめでとう！";
      } else {
        document.getElementById("message").textContent = "スイカを割り逃しました。もう一度挑戦してみてください！";
      }
    }

// タッチイベントのリスナーを追加
    watermelon.addEventListener("touchstart", sliceWatermelon);
    watermelon.addEventListener("touchend", showResult);
  </script>
</body>
</html>