Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

thiagocs

Transição de Imagens

Recommended Posts

efeito persiana:

 

<script language=javascript>

imagens = "imagem1,imagem2,imagem3,imagem4,imagem5";

tipo = ".jpg";

largura = 200;

altura = 150;

dir_imagens = "imagens/";

cor_persiana = "000000";

largura_persiana = 10;

altura_persiana = altura;

segundos = 0.2; // velocidade (abrir/fechar)

segundos_exibir = 2; // tempo de duração da imagem

 

 

tempo = (segundos*1000);

tempo_exibir = (segundos_exibir*1000);

nome_persiana = "persiana";

nome_tabela = "tabela1";

imagens = imagens.split(",");

function numero_rand(qtd_img){

return Math.round(Math.random() * qtd_img);

}

pos = numero_rand((imagens.length-1));

imagem = imagens[pos];

escrever = "<table name="+nome_tabela+" id="+nome_tabela+" background="+dir_imagens+imagem+tipo+" width="+largura+" height="+altura+" border=0 cellspacing=0 cellpadding=0><tr><td>";

escrever += "<table border=0 cellspacing=0 cellpadding=0><tr>";

qtd = (largura/largura_persiana);

for(i=0;i<qtd;i++){

escrever += "<td align=center width="+largura_persiana+">";

escrever += "<table name=\""+nome_persiana+i+"\" id=\""+nome_persiana+i+"\" border=0 width="+(largura_persiana+1)+" height="+altura_persiana+" style=\"background-color="+cor_persiana+";\" cellspacing=0 cellpadding=0><tr><td></td></tr></table>";

escrever += "<td>";

}

escrever += "</tr></table>";

escrever += "</td></tr></table>";

document.write(escrever);

 

guardar = 1;

fechar = 0;

function persiana(n){

for(i=0;i<qtd;i++){

e = document.all[nome_persiana+i];

if(n==1){

if(e.width>1){

e.width--;

}else{

e.style.background = "";

guardar = 0;

atraso = tempo_exibir;

}

}else{

fechar = 0;

if(fechar==0){

e.style.background = cor_persiana;

fechar = 1;

atraso = tempo;

}

if(e.width<largura_persiana){

e.width++;

}else{

if(guardar==0){

guardar = 1;

pos = numero_rand((imagens.length-1));

imagem = dir_imagens+imagens[pos]+tipo;

document.all[nome_tabela].background = imagem;

}

}

}

}

if(guardar==1){

setTimeout("persiana(1)",tempo);

}else{

setTimeout("persiana(2)",atraso);

}

}

persiana(1);

</script>

obs: recomendo usar um pre-carregador de imagens

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.