[Resolvido] Alterar Background automaticamente

[freddys_ 0]

Pessoal tenho uma div chamada topo, segue o css dela:

<style>

#topo{

width:960px;

height:309px;

background:url(imagens/bg_topo01.jpg) no-repeat;

margin:0 auto;

}

</style>

 

O que eu preciso é que o background mude sozinho:

"background:url(img/topo01.jpg) no-repeat;" para

"background:url(img/topo02.jpg) no-repeat;" para

"background:url(img/topo03.jpg) no-repeat;"

 

Li na net que da pra fazer em JQuery, alguem poderia me ajudar a fazer isso? Valeu!

[Lucas Guima 164]

Quer que fique alternando de tempos em tempos? Quando clicar em algum lugar?

 

Dê mais detalhes.

[freddys_ 0]

foi mal, esqueci de comentar que fique alternando de 3 em 3 segundos, automaticamente!!

[Denilson Telaroli 7]

use jQuery

 

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
var item = 2;//configure este valor para começar no ítem que você preferir
setInterval(function{
switch(item){
case 1:
$('#topo').css('background', 'url(img/topo01.jpg) no-repeat');
item++;
break;
case 2:
$('#topo').css('background', 'url(img/topo02.jpg) no-repeat');
item++;
break;
case 3:
$('#topo').css('background', 'url(img/topo03.jpg) no-repeat');
item = 1;
break;
}
}, 3000); //segundos * 1000 (milisegundos)
</script>

 

 

foi mal, esqueci de comentar que fique alternando de 3 em 3 segundos, automaticamente!!

[Lucas Guima 164]

Pra isso não precisa Ajax.

 

Utilize a função setInterval para executar a troca a cada 3 segundos.

E dentro dela, a função .css, do jQuery.

[freddys_ 0]

Valeu a todos, deu certinho!

Segue o codigo, so faltou o () do function ali na linha do setInterval

 

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
var item = 2;//configure este valor para começar no ítem que você preferir
setInterval(function() {
switch(item){
case 1:
$('#topo').css('background', 'url(img/topo01.jpg) no-repeat');
item++;
break;
case 2:
$('#topo').css('background', 'url(img/topo02.jpg) no-repeat');
item++;
break;
case 3:
$('#topo').css('background', 'url(img/topo03.jpg) no-repeat');
item = 1;
break;
}
}, 3000); //segundos * 1000 (milisegundos)
</script>

 

Valeu mesmo!!!