蟹を投げつけてビルを爆破させる's game

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

No:29598

←

Prev Next

→

蟹を投げつけてビルを爆破させる
Developer User14508｜Date and time 23/12/17 19:14:28
Build time 28.164 sec｜Game capacity 3.122KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>蟹爆弾ゲーム</title>
    <style>
        body {
            margin: 0;
            padding: 0;
            font-family: Arial, sans-serif;
            background-color: #222;
            color: #fff;
        }
        canvas {
            display: block;
        }
        #score {
            position: absolute;
            top: 10px;
            left: 10px;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>
    <script>
        // ゲームオブジェクト及び定数
        var game = {
            crabImage: null,
            buildingImage: null,
            crabSize: 50,
            buildingSize: {
                width: 100,
                height: 300
            },
            buildingSpeed: 5,
            score: 0
        };

// ゲームの初期化
        function init() {
            var canvas = document.getElementById("gameCanvas");
            game.context = canvas.getContext("2d");

// 画像の読み込み
            game.crabImage = new Image(game.crabSize, game.crabSize);
            game.crabImage.src = "crab.png";
            game.buildingImage = new Image(game.buildingSize.width, game.buildingSize.height);
            game.buildingImage.src = "building.png";

// タッチ操作のイベントリスナーを設定
            canvas.addEventListener("touchstart", handleTouchStart, false);
            canvas.addEventListener("touchmove", handleTouchMove, false);

// ゲームのメインループ
            setInterval(update, 20);
        }

// タッチ操作時の処理
        function handleTouchStart(event) {
            event.preventDefault();
            var touch = event.touches[0];
            game.crabX = touch.clientX - game.crabSize / 2;
        }

function handleTouchMove(event) {
            event.preventDefault();
            var touch = event.touches[0];
            game.crabX = touch.clientX - game.crabSize / 2;
        }

// ゲームの更新処理
        function update() {
            // 背景を描画
            game.context.fillStyle = "#222";
            game.context.fillRect(0, 0, 800, 600);

// ビルを移動
            game.buildingSize.width -= game.buildingSpeed;
            if (game.buildingSize.width <= 0) {
                game.buildingSize.width = 800;
                game.score++;
            }

// ビルを描画
            game.context.drawImage(game.buildingImage, game.buildingSize.width, 300 - game.buildingSize.height, game.buildingSize.width, game.buildingSize.height);

// 蟹を描画
            game.context.drawImage(game.crabImage, game.crabX, 550 - game.crabSize, game.crabSize, game.crabSize);

// スコアを表示
            game.context.fillStyle = "#fff";
            game.context.font = "20px Arial";
            game.context.fillText("Score: " + game.score, 10, 30);
        }

// ゲームの開始
        init();
    </script>
</body>
</html>