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

No:40201

←

Prev Next

→

車のゲーム
Developer User18015｜Date and time 24/2/1 17:37:59
Build time 15.853 sec｜Game capacity 2.773KB｜

Script

車のゲーム

画面をタップして車を操作しよう！

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>車のゲーム</title>
</head>
<body>

<h1>車のゲーム</h1>
  <p>画面をタップして車を操作しよう！</p>

// ゲームを開始する関数
      start: function() {
        this.context = this.canvas.getContext("2d");
        this.car = new Car();
        this.started = true;

// イベントリスナーを追加してタップを監視する
        this.canvas.addEventListener("touchstart", this.tap.bind(this));
        this.canvas.addEventListener("mousedown", this.tap.bind(this));

// メインゲームループを開始する
        setInterval(this.update.bind(this), 20);
      },

// タップした時の処理
      tap: function() {
        this.car.jump();
      },

// ゲームのメインループ
      update: function() {
        this.clear();
        this.car.update();
        this.drawScore();

// ゲームオーバー判定
        if (this.car.y + this.car.height >= this.canvas.height) {
          this.gameOver();
        }
      },

// スコアを描画する関数
      drawScore: function() {
        this.context.font = "20px Arial";
        this.context.fillStyle = "black";
        this.context.fillText("Score: " + this.score, 10, 30);
      },

// ゲームオーバー処理
      gameOver: function() {
        this.started = false;
        alert("Game Over! Score: " + this.score);
        location.reload();
      },

// キャンバスをクリアする関数
      clear: function() {
        this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
      }
    };

// 車の定義
    function Car() {
      this.width = 50;
      this.height = 30;
      this.x = 50;
      this.y = game.canvas.height / 2 - this.height / 2;
      this.speedY = 0;
      this.gravity = 0.5;

this.update = function() {
        this.speedY += this.gravity;
        this.y += this.speedY;

// 車が画面からはみ出ないようにする
        if (this.y + this.height >= game.canvas.height) {
          this.y = game.canvas.height - this.height;
          this.speedY = 0;
        }

this.draw();
      };

this.jump = function() {
        this.speedY = -10;
      };

this.draw = function() {
        game.context.fillStyle = "🚗";
        game.context.fillRect(this.x, this.y, this.width, this.height);
      };
    }

// ゲームを開始する
    game.start();
  </script>

</body>
</html>