To com um problema, não consigo fazer com que os textos passem do 1 para o 2 do 2 para o 3 e assim por diante automaticamente e quando chegar no final faça o loop mostrando as informações/imagens automaticamente desde o começo de novo, segue o código:
<html>
<head>
<title>Destaques</title>
<style type="text/css">
<!--
.fora{
width: 300px;
height: 150px;
border: #0099cc 1px Solid;
padding: 10px;
}
.i_esq{
width: 135px;
height: 130px;
border: #000000 1px Solid;
float: left;
}
.i_dir{
width: 135px;
height: 130px;
border: #000000 1px Solid;
}
-->
</style>
<script language="JavaScript" type="text/javascript">
<!--
imagens = new Array();
textos = new Array();
imagens[0] = '<img src="imagens/imagem1.gif" width="130px" height="60px">';
imagens[1] = '<img src="imagens/imagem2.gif" width="130px" height="60px">';
imagens[2] = '<img src="imagens/imagem3.gif" width="130px" height="60px">';
imagens[3] = '<img src="imagens/imagem4.gif" width="130px" height="60px">';
textos[0] = 'Fernando Costa Migliorini';
textos[1] = 'bla bla bla bla bla bla bla bla bla';
textos[2] = 'o rato roeu a roupa do rei de roma';
textos[3] = 'Italia Italy Italia Italy Italia Italy Italia Italy Italia Italy';
cont = 0;
function muda(){
cont++;
if (cont == 4){
cont = 0;
}
document.getElementById('esq').innerHTML = imagens[cont];
document.getElementById('dir').innerHTML = textos[cont];
}
//-->
</script>
</head>
<body>
<div align="center" class="fora" style="width: 147px; height: 150px">
<div id="esq" class="i_esq" style="width: 130px; height: 60px"><script> document.write(imagens[0]); </script></div>
<div id="dir" class="i_dir" style="width: 130px; height: 78px"><script> document.write(textos[0]); </script></div>
<a onclick="muda();" onmouseover="style.cursor= 'pointer';">Próximo</a>
</div>
</body>
</html>
Help!
