Fighting action game between monsters's game

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

No:6439

162

←

Prev Next

→

Fighting action game between monsters
Developer User3884｜Date and time 23/7/2 13:01:05
Build time 30.196 sec｜Game capacity 3.026KB｜

Script

実装例として、以下のような怪獣同士の対戦格闘アクションゲームを作成してみます。

この例では、赤いブロックがプレイヤー1を、青いブロックがプレイヤー2を表しており、プレイヤー1はキーボードの「←」「→」「↑」「↓」キーで移動できます。プレイヤー2は、「A」「D」「H」「J」キーで移動できます。ブロック同士がぶつかるなどの当たり判定や攻撃などが用意されておりませんが、基本的な部分を実装しました。上記のコードをHTMLファイルに保存し、ブラウザで開くとプログラムが実行され、ゲームとしてプレイすることができます。ただし、このゲームはPCでの操作を想定しているため、スマートフォンでの操作には適していません。

←

Prev　Next

→ 　

Back　

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

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

実装例として、以下のような怪獣同士の対戦格闘アクションゲームを作成してみます。

```html
<!DOCTYPE html>
<html>
<head>
    <title>怪獣対戦ゲーム</title>
    <style>
        #player1, #player2 {
            width: 100px;
            height: 100px;
            position: absolute;
            top: 200px;
            left: 0;
            background: red;
        }
        #player2 {
            left: 200px;
            background: blue;
        }
    </style>
</head>
<body>
    <div id="player1"></div>
    <div id="player2"></div>

// プレイヤーの移動速度
        var playerSpeed = 20;
        
        // キー入力のイベントリスナーを設定
        document.addEventListener("keydown", function(event) {
            switch(event.keyCode) {
                case 37: // 左
                    player1Left -= playerSpeed;
                    break;
                case 39: // 右
                    player1Left += playerSpeed;
                    break;
                case 87: // 上
                    player1Top -= playerSpeed;
                    break;
                case 83: // 下
                    player1Top += playerSpeed;
                    break;
                case 65: // A
                    player2Left -= playerSpeed;
                    break;
                case 68: // D
                    player2Left += playerSpeed;
                    break;
                case 72: // H
                    player2Top -= playerSpeed;
                    break;
                case 74: // J
                    player2Top += playerSpeed;
                    break;
            }

// プレイヤーの位置を更新
            document.getElementById("player1").style.left = player1Left + "px";
            document.getElementById("player1").style.top = player1Top + "px";
            document.getElementById("player2").style.left = player2Left + "px";
            document.getElementById("player2").style.top = player2Top + "px";
        });
    </script>
</body>
</html>
```

上記のコードをHTMLファイルに保存し、ブラウザで開くとプログラムが実行され、ゲームとしてプレイすることができます。ただし、このゲームはPCでの操作を想定しているため、スマートフォンでの操作には適していません。