Cria um jogo onde temos uma grid tendo 1=parade 2=carro 3=porta 5=jogador 9=refazer o labirinto E jogador poderá anda para esquerda direita baixo cima's game

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

No:19912

155

←

Prev Next

→

Cria um jogo onde temos uma grid tendo 1=parade 2=..ALL
Developer User8225｜Date and time 23/10/7 8:44:42
Build time 17.888 sec｜Game capacity 4.209KB｜

Script

Aqui está um exemplo do código HTML e JavaScript para criar o jogo de labirinto conforme solicitado:

Este código cria um jogo de labirinto com as seguintes regras: - A grid é formada por elementos `<div>` com a classe `.cell`. - O jogador é representado pelo elemento com o id `player` e tem uma cor azul. - Para se mover, o jogador deve pressionar as teclas de seta (seta para cima, para baixo, para a esquerda ou para a direita). - O jogador não pode atravessar paredes (valor 1) ou obstáculos (valor 2). - O jogador vence quando alcançar a porta (valor 3) e uma mensagem de parabéns é exibida. Observação: Como não foi mencionado como o jogador pode "refazer o labirinto" (valor 9), essa opção não está implementada no código. Espero que isso ajude!

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

Aqui está um exemplo do código HTML e JavaScript para criar o jogo de labirinto conforme solicitado:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Jogo de Labirinto</title>
    <style>
        #gameGrid {
            display: grid;
            grid-template-columns: repeat(5, 80px);
            grid-template-rows: repeat(5, 80px);
            gap: 5px;
        }
        .cell {
            width: 80px;
            height: 80px;
            text-align: center;
            font-size: 40px;
            background-color: white;
        }
        #player {
            background-color: blue;
            color: white;
        }
    </style>
</head>
<body>
    <div id="gameGrid">
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">5</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">2</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">9</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
        <div class="cell">1</div>
    </div>

var gridSize = document.querySelectorAll(".cell").length;

// Limpar a posição anterior do jogador
            player.classList.remove("cell");

// Determinar a próxima posição do jogador
            switch(event.key) {
                case "ArrowUp":
                    playerIndex -= 5; // Mover para cima
                    break;
                case "ArrowDown":
                    playerIndex += 5; // Mover para baixo
                    break;
                case "ArrowLeft":
                    playerIndex -= 1; // Mover para a esquerda
                    break;
                case "ArrowRight":
                    playerIndex += 1; // Mover para a direita
                    break;
            }

// Verificar se o jogador atingiu a porta (valor 3)
            if (playerIndex >= 0 && playerIndex < gridSize && document.querySelectorAll(".cell")[playerIndex].textContent === "3") {
                alert("Parabéns! Você venceu!");
                return; // Retorna para evitar que o jogador se mova após vencer
            }

// Verificar se o jogador atingiu a parede (valor 1) ou um obstáculo (valor 2)
            if (playerIndex >= 0 && playerIndex < gridSize && (document.querySelectorAll(".cell")[playerIndex].textContent === "1" || document.querySelectorAll(".cell")[playerIndex].textContent === "2")) {
                playerIndex = Array.from(document.querySelectorAll(".cell")).indexOf(player); // Mantém a posição do jogador atual
            }

// Atualizar a posição do jogador
            player = document.querySelectorAll(".cell")[playerIndex];
            player.classList.add("cell");

});
    </script>
</body>
</html>
```

Este código cria um jogo de labirinto com as seguintes regras:
- A grid é formada por elementos `<div>` com a classe `.cell`.
- O jogador é representado pelo elemento com o id `player` e tem uma cor azul.
- Para se mover, o jogador deve pressionar as teclas de seta (seta para cima, para baixo, para a esquerda ou para a direita).
- O jogador não pode atravessar paredes (valor 1) ou obstáculos (valor 2).
- O jogador vence quando alcançar a porta (valor 3) e uma mensagem de parabéns é exibida.

Observação: Como não foi mencionado como o jogador pode "refazer o labirinto" (valor 9), essa opção não está implementada no código.

Espero que isso ajude!