Ir para conteúdo
Fórum Script Brasil
  • 0

Tabela com imagens aleatórias


KELLIMA

Pergunta

Olá pessoal!

Alguém poderia explicar como substituir as cores por imagens com links nesse Script??

<script type="text/javascript">
function aleatorio(inferior,superior){//não suporto plagio, por isso estou falando: não fui eu que criei essa funcao :P autoria do pessoal da criarweb
    var numPossibilidades = superior - inferior;
    aleat = Math.random() * numPossibilidades 
    aleat = Math.floor(aleat);
    return parseInt(inferior) + aleat 
} 

window.onload = function() {
    var imagens=["#ff0000","#00ff00","#0000ff","#cccccc","#000000","#ffffff","#ffff00","#00ffff","#ff00ff"];//exemplo de array com enderecos para imagens
    var tabela = document.getElementById("tabela");//pega uma referencia a tabela 

    for(r=0; r<tabela.rows.length; r++) {//percorre as linhas da tabela
        for(c=0; c<tabela.rows[r].cells.length; c++) {
            if(imagens.length == 0) {//se não houver mais imagens no array, ele simplesmente para de por imagens...
                r = tabela.rows.length;
                break;
            }
            var imgRandom = aleatorio(0, imagens.length-1);//cria variavel que vai referenciar uma posicao no array de imagens... 
            //gera um numero randomico de 0 ate o maximo de elementos do array-1, ouseja, "percorre" todo o array 
            tabela.rows[r].cells[c].style.backgroundColor = imagens[imgRandom]//insere a imagem no background. Troque por backgroundImage = "url("+imgens[imgRandom]+")";
            imagens.splice(imgRandom, 1);//primeira propriedade determina qual posicao tu quer mecher
            //e a segunda, se for 1 ela deleta a posicao atual e tras todas as outras para tras...
            //faco isso para que as imagens não se repitam :P
        } 
    }
}
</script>

<table id="tabela" border="1" width="400" height="400"><!--tabela 3x3, você pode fazer a tabela que quiser... o script acima, vai adicionar imagens em qualquer tipo de tabela..--!>
    <tr><td></td><td></td><td></td></tr>
    <tr><td></td><td></td><td></td></tr>
    <tr><td></td><td></td><td></td></tr>
</table>

Editado por kuroi
Adicionar tag CODE
Link para o comentário
Compartilhar em outros sites

0 respostass a esta questão

Posts Recomendados

Até agora não há respostas para essa pergunta

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,1k
    • Posts
      651,8k
×
×
  • Criar Novo...