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

No:39905

79

マージゲーム
Developer 食べる鶏と熱いタバスコ｜Date and time 24/1/30 19:23:34
Build time 20.885 sec｜Game capacity 4.935KB｜

了解です。以下に、指定された条件でHTMLファイルを実装したマージゲームのサンプルコードを記述します。

Merge Game

このコードでは、HTMLの中身としては1つのh1要素と4つのdiv要素（セル）を持ち、セルの中身（数値）はJavaScriptの配列で管理されます。キーボードの左右矢印キーを押すことで、セルの数値をマージするゲームがプレイできます。また、ゲームが終了した際にはアラートが表示されます。

→ 　

0　

0　

　
　

[PR]現在の売れ筋ゲームランキング

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

(C)2023 HisashiApp

了解です。以下に、指定された条件でHTMLファイルを実装したマージゲームのサンプルコードを記述します。

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Merge Game</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }
        
        h1 {
            margin-top: 50px;
        }
        
        #container {
            display: inline-block;
            margin-top: 50px;
        }
        
        .cell {
            width: 100px;
            height: 100px;
            display: inline-block;
            margin: 5px;
            font-size: 36px;
        }
    </style>
</head>
<body>
    <h1>Merge Game</h1>
    <div id="container">
        <div class="cell" id="cell1"></div>
        <div class="cell" id="cell2"></div>
        <div class="cell" id="cell3"></div>
        <div class="cell" id="cell4"></div>
    </div>

<script>
        var cells = [0, 0, 0, 0];
        
        function generateNumber() {
            return Math.random() < 0.8 ? 2 : 4;
        }
        
        function generateRandomIndex() {
            return Math.floor(Math.random() * 4);
        }
        
        function updateCell(index) {
            var cell = document.getElementById("cell" + (index + 1));
            cell.innerHTML = cells[index] == 0 ? "" : cells[index];
        }
        
        function isGameOver() {
            return cells.indexOf(0) === -1 && !canMerge();
        }
        
        function canMerge() {
            for (var i = 0; i < cells.length - 1; i++) {
                if (cells[i] === cells[i + 1]) {
                    return true;
                }
            }
            return false;
        }
        
        function merge() {
            for (var i = 0; i < cells.length - 1; i++) {
                if (cells[i] === cells[i + 1]) {
                    cells[i] *= 2;
                    cells[i + 1] = 0;
                }
            }
        }
        
        function moveLeft() {
            merge();
            
            for (var i = 0; i < cells.length - 1; i++) {
                if (cells[i] === 0) {
                    for (var j = i + 1; j < cells.length; j++) {
                        if (cells[j] !== 0) {
                            cells[i] = cells[j];
                            cells[j] = 0;
                            break;
                        }
                    }
                }
            }
        }
        
        function moveRight() {
            merge();
            
            for (var i = cells.length - 1; i >= 1; i--) {
                if (cells[i] === 0) {
                    for (var j = i - 1; j >= 0; j--) {
                        if (cells[j] !== 0) {
                            cells[i] = cells[j];
                            cells[j] = 0;
                            break;
                        }
                    }
                }
            }
        }
        
        function move(direction) {
            if (isGameOver()) {
                alert("Game Over!");
                return;
            }
            
            if (direction === "left") {
                moveLeft();
            } else if (direction === "right") {
                moveRight();
            }
            
            updateCells();
            spawnNumber();
            
            if (isGameOver()) {
                alert("Game Over!");
                return;
            }
        }
        
        function updateCells() {
            for (var i = 0; i < cells.length; i++) {
                updateCell(i);
            }
        }
        
        function spawnNumber() {
            var emptyCells = [];
            
            for (var i = 0; i < cells.length; i++) {
                if (cells[i] === 0) {
                    emptyCells.push(i);
                }
            }
            
            if (emptyCells.length === 0) {
                return;
            }
            
            var randomIndex = emptyCells[generateRandomIndex()];
            cells[randomIndex] = generateNumber();
            updateCell(randomIndex);
        }
        
        document.addEventListener("keydown", function(event) {
            if (event.key === "ArrowLeft") {
                move("left");
            } else if (event.key === "ArrowRight") {
                move("right");
            }
        });
        
        updateCells();
        spawnNumber();
    </script>
</body>
</html>
```

このコードでは、HTMLの中身としては1つのh1要素と4つのdiv要素（セル）を持ち、セルの中身（数値）はJavaScriptの配列で管理されます。キーボードの左右矢印キーを押すことで、セルの数値をマージするゲームがプレイできます。また、ゲームが終了した際にはアラートが表示されます。