1. java
  2. android
  3. c#
  4. .net
  5. javascript
  6. php
  7. jquery
  8. html
  9. sql

Criando um array em javascript e selecionando algumas casas

Estou tentando desenhar um tabuleiro onde 1 é a casa em que aparece e o 0 é desativado ou escondido pelo CSS...

JAVASCRIPT

 var campoMinado = new Array (7);
            campoMinado[0] = [1, 0, 1, 1, 1, 0, 0, 0, 0, 0, 0]
            campoMinado[1] = [1, 0, 1, 0, 1, 0, 1, 1, 1, 0, 0]
            campoMinado[2] = [1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 0]
            campoMinado[3] = [1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1]
            campoMinado[4] = [1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1]
            campoMinado[5] = [1, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1]
            campoMinado[6] = [0, 0, 0, 0, 1, 1, 1, 0, 1, 1, 1]

            function inicializa()
            {
            desenhaTabela();               
            }         

            function desenhaTabela()
                {
                    var board = new Array();  
                    board.push("<table><tr>");
                    for (var i = 0; i < campoMinado.length; i++) {
                        if (i != 0) board.push("</tr><tr>");
                        for (var j = 0; j < campoMinado[i].length; j++) {                    
                            board.push( <td +

                                        '    onMouseOver="cellClicked(this)"' +
                                        '    onMouseOut="cellClicked(this)"' +
                                        '    onClick="cellClicked(this)">' +
                                        campoMinado[i][j] + "</td>"
                            );
                        }
                    }
                    board.push("</tr></table>"); 
                    document.getElementById("board").innerHTML = board.join("\n");
                }

            function cellClicked(thisCell) 
            {
                if (thisCell.className == "clicked") return;
                thisCell.className = "clicked";
                switch (thisCell.innerHTML) {
                    case "0": thisCell.style.color = "#FFFFFF"; break;
                    case "1": thisCell.style.color = "#00FFFF"; break;
                        return;
                }               
            }        
            window.onload = inicializa;

HTML

<!DOCTYPE html>
<html>
<head>
<title>Campo Minado em Javascript</title>

<link href="jogo.css" rel="stylesheet" type="text/css">
<script src="net.js"></script>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>

<h1>Campo - Minado</h1>

<noscript>
Seu navegador nao tem Javascript (ou esta desligado)
</noscript>

<div id="board">
<!-- O javascript vai colocar o campo minado aqui -->
</div>

<div id="statusline">
<!-- O javascript vai colocar o texto de status aqui -->
</div>

</body>
</html>

CSS

    body
        {
        font-family         : sans-serif;
        text-align         : center;
        }

    h1
    {    
        font-family: Old English Text MT, Algerian, Cooper Black ;
        font-size  : 35px;
        color      : #4682B4;
    }
    table
        {
        margin            : auto;
        background-color: #40E0D0;
        border-collapse    : separate;
        border-spacing    : 0px;
        }
    td
        {
        width        : 44px; 
        line-height    : 44px;
        border        : 2px outset #4682B4;
        text-align    : center;

        /* manha de "esconder" o texto */
        background-color: #40E0D0;
        color            : #ffffff;
        }
    td.clicked
        {
        background-color: #01DFD7;
        color :        #00b ;
        font-size    : 25px;
        border        : 2px solid #4682B4;
        }
    p
        {
        font-size    : small;
        text-align    : justify;
        }
    #browsers
        {
        position    : fixed;
        bottom        : 0;
        left        : 0;
        width        : 100%;
        padding-top    : 10px;
        padding-bottom    : 15px;
        background-color: #ffd;
        border-top    : 1px solid silver;
        text-align    : center;
        font-weight    : bold;
        }
    .browserok  { color    : #0c0; }
    .browseraok { color    : #f60; }
    .browsernok { color    : #f00; }
  • E qual seria a pergunta? :)

    Rodrigo Sasaki   28 de mai de 2013
  • Não está aparecendo nada na tela, só o nome do jogo, o caminho não esta aparecendo, eu já olhei e reolhei e não sei o que pode estar errado...

    Alê :)   28 de mai de 2013
  1. Você vai ver essas setas em qualquer página de pergunta. Com elas, você pode dizer se uma pergunta ou uma resposta foram relevantes ou não.
  2. Edite sua pergunta ou resposta caso queira alterar ou adicionar detalhes.
  3. Caso haja alguma dúvida sobre a pergunta, adicione um comentário. O espaço de respostas deve ser utilizado apenas para responder a pergunta.
  4. Se o autor da pergunta marcar uma resposta como solucionada, esta marca aparecerá.
  5. Clique aqui para mais detalhes sobre o funcionamento do GUJ!

1 resposta

Não é a resposta que estava procurando? Procure outras perguntas com as tags arrays css html javascript ou faça a sua própria pergunta.