AI game creator

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

No:13875

←

Prev Next

→

Пятнашки
Developer User6030｜Date and time 23/8/30 6:00:32
Build time 20.004 sec｜Game capacity 3.496KB｜

Script

Вот пример кода для игры "Пятнашки" в виде одного HTML-файла с использованием JavaScript:

Вот игра "Пятнашки" в виде одного HTML-файла. При открытии страницы на смартфоне вы увидите игровое поле, состоящее из 15 плиток, которые можно перемещать, нажимая на них. Цель игры - упорядочить числа от 1 до 15, перемещая плитки в пустую ячейку. Игра автоматически перемешивает плитки при запуске. При перемещении плитки на смартфоне можно использовать касания вместо нажатий мыши, чтобы играть.

←

Prev　Next

→ 　

Back　

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

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

Вот пример кода для игры "Пятнашки" в виде одного HTML-файла с использованием JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Пятнашки</title>
    <style>
        #game-board {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            grid-gap: 10px;
            width: 400px;
            margin: 0 auto;
        }
        .tile {
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 20px;
            width: 100%;
            height: 100px;
            background-color: lightblue;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <div id="game-board"></div>

function createTiles() {
            for (var i = 0; i < 15; i++) {
                var tile = document.createElement("div");
                tile.className = "tile";
                tile.textContent = i + 1;
                tile.addEventListener("click", tileClickHandler);
                tiles.push(tile);
                gameBoard.appendChild(tile);
            }
        }

function shuffleTiles() {
            for (var i = tiles.length - 1; i > 0; i--) {
                var j = Math.floor(Math.random() * (i + 1));
                var temp = tiles[i];
                tiles[i] = tiles[j];
                tiles[j] = temp;
            }

tiles.forEach(function (tile, index) {
                tile.style.order = index;
            });

emptyTile = { row: 3, col: 3 };
        }

function tileClickHandler() {
            var tileClicked = this;
            var tileOrder = parseInt(tileClicked.style.order);

var clickedRow = Math.floor(tileOrder / 4);
            var clickedCol = tileOrder % 4;

if (Math.abs(clickedRow - emptyTile.row) + Math.abs(clickedCol - emptyTile.col) === 1) {
                swapTiles(tileClicked, emptyTile);
            }
        }

function swapTiles(tile1, tile2) {
            var tempOrder = tile1.style.order;
            tile1.style.order = tile2.style.order;
            tile2.style.order = tempOrder;

emptyTile.row = Math.floor(tile1.style.order / 4);
            emptyTile.col = tile1.style.order % 4;
        }

// Запускаем игру после загрузки страницы
        window.addEventListener("load", function () {
            createTiles();
            shuffleTiles();
        });
    </script>
</body>
</html>
```

При перемещении плитки на смартфоне можно использовать касания вместо нажатий мыши, чтобы играть.