Ir para conteúdo

POWERED BY:

Arquivado

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

DackAle

Destaques Imasters

Por , em Javascript

Recommended Posts

DackAle    0

DackAle
Postado

E ae galeraSeguinte, estou produzindo um Portal e precisava exibir alguns dados, mudando, mas não poderia ser em Flash, porque tem que ser dinamico e não manjo de Flash para integrar a esse ponto...E vi que no Imasters, os Destaques mudam a cada X segundos e achei interessante...Pelo Código Fonte, entendi que existem 5 Divs com os conteudos, sendo que é mostrado apenas 1 por vez no MESMO LOCAL... mas como colocar 5 divs no mesmo local e fazer o conteudo mudar a X segundos ?Alguem poderia me ajudar com a construção do JS para isso ?Tenho uma noção básica de JS, que dá para levar...rsObrigado desde jáAbraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

Ratu    0

Ratu
Postado

os divs devem estar hidden beleza ?eh uma ideia, tb naum manjo muito de javascript... mas acredito que tenham usado o setTimeout, que executa uma funcao em um determinado tempo... ai eh soh esconder um div e abilitar outro...beleza? !

Compartilhar este post

Link para o post
Compartilhar em outros sites

Ratu    0

Ratu
Postado

entaum cara, com este setTimeout você pode criar uma funcao que esconda todos e depois abilite somente um! procure saber + sobre este comando e o javascript para esconder e revelar um div !!* isso tudo eh pensando, nunca fiz, mas acredito que seja assim...

Compartilhar este post

Link para o post
Compartilhar em outros sites

DackAle    0

DackAle
Postado

Bom tentei construir o basico do basico

 

Criei 5 divs e ocultei as 5...

 

e criei uma função que vai sendo chamado para mostrar de uma a uma... problema é que na segunda did da um erro :rolleyes:

 

<html><head><title>Untitled Document</title><script language="javascript">var N = 1;function muda() {	if (N == 5) {		divatual = "noticias" + N;		alert(divatual);		document.getElementById(divatual).style.display = '';		N = 1;	}	else	{		divatual = "noticias" + N;		alert(divatual);		document.getElementById(divatual).style.display = '';		N =+ N;	}}setTimeout("muda()",1);</script></head><body><div id="noticias1" style="display:none;">teste1</div><div id="noticias2" style="display:none;">teste2</div><div id="noticias3" style="display:none;">teste3</div><div id="noticias4" style="display:none;">teste4</div><div id="noticias5" style="display:none;">teste5</div></body></html>

Problema é que mostra o primeiro e ---to, acabousa shusuhshushuas o settimeout não fica dando um "reload" digamos... para continuar chamando a função e ir mostrando os outros

 

Usei errado o setimeout ? :huh:

 

Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

Salgado    4

Salgado
Postado

Vamos lá, o setTimeOut deve estar dentro da função, chamando ela mesma e no <body> você deve acrescentar um onload chamando a sua função pela 1ª vez, depois disso o setTimeOut se encarrega de manter em Loop, atente que é em milissegundos o tempo e não em segundos. Tome cuidado para não ficar algo demasiadamente pesado. Fiz umas correções e é esse que rodou aqui:

<html>
<head>
<title>Untitled Document</title>
<script language="javascript">
var N = 1;

function muda() {
if (N == 6) {
	N = 1;
}
divatual = "noticias" + N;
alert(divatual);

document.getElementById(divatual).style.display = '';
N = N+1;
setTimeout("muda()",1000);
}
</script>
</head>

<body onload="muda();">
<div id="noticias1" style="display:none;">teste1</div>
<div id="noticias2" style="display:none;">teste2</div>
<div id="noticias3" style="display:none;">teste3</div>
<div id="noticias4" style="display:none;">teste4</div>
<div id="noticias5" style="display:none;">teste5</div>
</body>
</html>

Acho que vou tentar fazer um Chat para estudar usando isso!

Compartilhar este post

Link para o post
Compartilhar em outros sites

DackAle    0

DackAle
Postado

Boa Salgado, me ajudou tanto a explicação quanto o código

 

deu certo, ele muda as divs...

 

Ficou show, agora só jogar isso para o meu sistema e o melhor, roda no fire e ie blzinha :D

 

<html><head><title>Untitled Document</title><script language="javascript">var N = 1;function muda() {	if (N == 6) {		N = 1;	}	divatual = "noticias" + N;		for (i=1; i<6; i++) {	if (i != N) {	divatual2 = "noticias" + i;  	document.getElementById(divatual2).style.display = 'none';	}	}	document.getElementById(divatual).style.display = '';	N = N + 1;	setTimeout("muda()",5000);}</script></head><body onload="muda();"><div id="noticias1" style="display:none;">teste1</div><div id="noticias2" style="display:none;">teste2</div><div id="noticias3" style="display:none;">teste3</div><div id="noticias4" style="display:none;">teste4</div><div id="noticias5" style="display:none;">teste5</div></body></html>

Quem quiser tá ae :D

 

Abração e valeu galera

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito