Problemas com mudança de textos JQuery

1. Problemas com mudança de textos JQuery

Wygor Felipe Souza
wfs1995

(usa Red Hat)

Enviado em 28/07/2016 - 15:17h

Boa tarde pessoal... estou fazendo alguns testes aqui... a minha ideia é mudar um texto que esta sobre uma imagem a cada 5 segundos. O que sucede é o seguinte:

a primeira legenda não aparece, a segunda aparece e trava ali e não muda mais, ja tentei solucionar o problema de todas as formas que me vieram a cabeça, aliás, estou nisso desde cedo e já nao tenho mais ideias sobre o que fazer. Se alguém puder me ajudar, agradecerei muito.


código JQuery


setInterval(function () {

if($('p').eq(0).is(':visible')){
$('p').eq(0).css('visibility','hidden');
$('p').eq(1).css('visibility','visible');
$('p').eq(2).css('visibility','hidden');
}else if($('p').eq(1).is(':visible')){
$('p').eq(0).css('visibility','hidden');
$('p').eq(1).css('visibility','hidden');
$('p').eq(2).css('visibility','visible');
}else if($('p').eq(2).is(':visible')){
$('p').eq(0).css('visibility','visible');
$('p').eq(1).css('visibility','hidden');
$('p').eq(2).css('visibility','hidden');
}else{
$('p').eq(0).css('visibility','visible');
$('p').eq(1).css('visibility','hidden');
$('p').eq(2).css('visibility','hidden');
}

}, 5000);



código HTML


<div id="legenda"><p>legenda 1</p></div>
<div id="legenda"><p>legenda 2</p></div>
<div id="legenda"><p>legenda 3</p></div>



código CSS


#legenda{
width:400px;
background-color: rgba(0,0,0,0.6);
height:60px;
position: absolute;
z-index: 1;
top: 390px;
line-height: 60px;
visibility: visible;


}

p{
color: white;
font-family: ubuntu;
font-weight: bold;
font-size: 11pt;
z-index: 3;
padding: 0px;
visibility: hidden;

}



  






Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts