fala galera..
tow com o seguinte preoblema...
gostaria de fazer um random de imagens de fundo, que se alternasse de tantos em tantos segundos... soh q o problema q o meu fundo fica dentro de uma determinada celula da tabela...
tem como fazer isto??
valeu
Fundo Random De Uma Celula
Started By thiagotm, 26/04/2009, 21:17
4 replies to this topic
#1
Posted 26/04/2009, 21:17
#2
Posted 27/04/2009, 09:42
Essa célula tem uma tag img que está a imagem, ou simplesmente, está como fundo da célula?
Bom, supondo que esteja de fundo da célula:
Tente da seguinte maneira...
Passo um: Essa célula da tabela tem que ter um ID. Localize-a e adiciona um id, exemplo:
Depois, criar a função:
E por último, chamar a função. Na sua tag BODY, deixe assim:
Não testei, mas deve funcionar.
Apenas lembrando que para isso funcionar, a imagem de fundo da célula deve ser aplicada com CSS. Se você usar:
Bom, supondo que esteja de fundo da célula:
Tente da seguinte maneira...
Passo um: Essa célula da tabela tem que ter um ID. Localize-a e adiciona um id, exemplo:
<td id="celula"></td>Em seguida, criar um array com a localização das imagens:
<script type="text/javascript"> var imagens=[]; imagens[0] = 'imagens/imagem1.jpg'; imagens[1] = 'imagens/imagem2.jpg'; imagens[2] = 'imagens/imagem3.jpg'; imagens[3] = 'imagens/imagem4.jpg'; imagens[4] = 'imagens/imagem5.jpg'; // Para adicionar mais imagens, só copie uma linha, cole embaixo, e aumente em um o número que está entre colchetes. </script>
Depois, criar a função:
<script type="text/javascript"> function swapImg(){ var num = Math.floor(Math.random()*imagens.length); // Sorteia um numero document.getElementById('ID_DA_CELULA').backgroundImage=imagens[num]; // Aqui, substitua ID_DA_CELULA pelo ID que você colocou na célula setTimeout("swapImg()",10000); // Tempo, em milésimos de segundos, que vai trocar de imagem. No caso, 10 segundos. } </script>
E por último, chamar a função. Na sua tag BODY, deixe assim:
<body onload="swapImg()">
Não testei, mas deve funcionar.
Apenas lembrando que para isso funcionar, a imagem de fundo da célula deve ser aplicada com CSS. Se você usar:
<td background="alapucha.jpg">Não funcionará. Neste caso, remova a propiedade background da tag TD.
#3
Posted 21/05/2009, 12:17
Pessoal, preciso mt da ajuda de vocês num script parecido com este ai, vou tentar ser bem claro rsrs:
Estou querendo mudar a logo do meu forum IPB, mas estou com problemas na hora de tratar a logomarca nas diferentes resoluções...
Eu fiz assim: criei uma tabela em 100% de largura, coloquei o script para as imagens carregarem aleatoriamente, beleza até ai...
Mas minha intenção era fazer as imagens com 1.600 pixels de largura para que quanto maior a resolução a imagem ia continuar aparecendo... eu gostaria de saber se teinha como centralizar a imagem de fundo da tabela randomica.
No exemplo feito ai, ela fica alinhada padrao na esquerda.
Me ajudem plz
Estou querendo mudar a logo do meu forum IPB, mas estou com problemas na hora de tratar a logomarca nas diferentes resoluções...
Eu fiz assim: criei uma tabela em 100% de largura, coloquei o script para as imagens carregarem aleatoriamente, beleza até ai...
Mas minha intenção era fazer as imagens com 1.600 pixels de largura para que quanto maior a resolução a imagem ia continuar aparecendo... eu gostaria de saber se teinha como centralizar a imagem de fundo da tabela randomica.
No exemplo feito ai, ela fica alinhada padrao na esquerda.
Me ajudem plz
#4
Posted 21/05/2009, 12:44
tecno, não sei bem o que você quer fazer ai ...
Se for colocar um monte de logos e se hover necessidade de linkar eles para algum lugar...
faça da seguinte forma( é css ):
div com width 100% e overflow hidden
dentro dela joga uma imagem mapeada com os logos
Agora se você quer deixar de fundo uma imagem com fundo continuo , tipo a do meu site( olha a propaganda ) www.edipo.com.br
você vai ter que fazer uma imagem que de pra se repetir na horizontal, e de preferencia, joga de fundo no body e falar via css que vai se repetir só horizontalmente.
Se for colocar um monte de logos e se hover necessidade de linkar eles para algum lugar...
faça da seguinte forma( é css ):
div com width 100% e overflow hidden
dentro dela joga uma imagem mapeada com os logos
<div style="width:100%; overflow: hidden; text-align: center;"> <!-- coloca aqui uma imagem mapeada com logos --> </div>
Agora se você quer deixar de fundo uma imagem com fundo continuo , tipo a do meu site( olha a propaganda ) www.edipo.com.br
você vai ter que fazer uma imagem que de pra se repetir na horizontal, e de preferencia, joga de fundo no body e falar via css que vai se repetir só horizontalmente.
<div style="background: url(suaImagem.gif) repeat-x"> <! -- seus logos randomicos etc...--> </div>
Edição feita por: Édipo Costa Rebouças, 21/05/2009, 12:46.
#5
Posted 21/05/2009, 20:18
Cara nem sei como agradecer, você me fez consegui acertar o código com tuas explicações, aqui está ele, pode ser útil para alguem tb...
Script Java para fundo de tabelas randomicas
Tabela pronta
Script Java para fundo de tabelas randomicas
<script type="text/javascript"> var images=new Array(); images[0]="logo1.jpg"; images[1]="logo2.jpg"; images[2]="logo3.jpg"; var amount = Math.floor(Math.random() * images.length); document.write('<style>#mytable{background-image:url('+images[amount]+'); background-position:center;}</style>'); </script>
Tabela pronta
<table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="329" id="mytable"></td> </tr> </table>
1 user(s) are reading this topic
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)