Jquery - Autorotation Accordion

**fra_ore_90** · 16-09-2011, 12:48

Ciao Ragazzi sono disperato!

Ho realizzato un semplicissimo accordion verticale simile a questo http://www.p51labs.com/accordion/

con questo condice

$(document).ready(function() {

$('div.sedi-accordion> div').hide();

$('div.sedi-accordion> div:first').show();

$('div.sedi-accordion> h3.titolo').click(function() {

$(this).next('div').slideToggle('fast')

.siblings('div:visible').slideUp('fast');

});

});

ed il seguente html/css

<div class="sedi-accordion">

<h3 class="titolo">Primo Accordion</h3>

<div class="content">

Contenuto Primo div

</div>

<h3 class="title">Secondo Accordion</h3>

<div class="content">

Contenuto Secondo div

</div>
</div>

Ora ho necessità di far aprire automaticamente, a rotazione, i div. Cioè 5 secondi il primo, 5 il swecondo, poi dinuovo dall'inizio.

Praticamente come questo però verticale!

Mi potete dare una mano?

**fra_ore_90** · 19-09-2011, 09:33

Ragazzi non vi viene in mente nulla?

questo secondo voi mi può essere d'aiuto?

**Al_katraz984** · 19-09-2011, 16:56

metti un temporizzatore che ti chiama la funzione per l'apertura dell'accordion in automatico..

**fra_ore_90** · 21-09-2011, 09:30

Al_katraz984 Grazie per il suggerimento!

Ma non conoscendo JS ti volevo chiedere se mi potevi dare qualche indizio in più su cui lavorare!

Com'è questo temporizzatore? esiste qualcosa in jquery che fa il caso mio!?

Grazie!

Fra

**Al_katraz984** · 21-09-2011, 09:43

ciao si c'è qualcosa a riguardo sul sito: link

**fra_ore_90** · 21-09-2011, 10:37

Niente. non riesco. sono riuscito a far chiudere in automatico il primo ed aprire il secondo ma poi non riinizia

**Al_katraz984** · 21-09-2011, 11:37

posta un po' di codice..

usa i tag [ php ]

**fra_ore_90** · 06-10-2011, 11:47

Rieccomi!

Scusate il mio maleducato silenzio ma il lavoro mi ha un po' invaso (per non parlare dell'università!)

Ora ho ricreato il file html con l'accordion funzionante.

infatti se io clicco sul titolo di un div questo si espande e si chiude quello aperto prima... ma come posso fare che ciò avvenga automaticamente ogni 10 secondi?

Ho già inserito il plugin jQuery Timers!

Grazie a chi mi aiuterà!!

Codice PHP:


<!DOCTYPE html>

<html>

<head>



    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js" type="text/javascript"></script>

    <script src="http://jquery.offput.ca/js/jquery.timers.js" type="text/javascript"></script>



    <script type="text/javascript">



    $(document).ready(function() {



        $('div.accordion> div').hide();

        $('div.accordion> div:first').show();

        $('div.accordion> h3.titolo').click(function() {

            $(this).next('div').slideToggle('fast').siblings('div:visible').slideUp('fast');

        });

    });



    </script>

</head>



<body>

  

<div class="accordion">



    <h3 class="titolo">Titolo 1</h3>



    <div class="content">

        Contenuto 1

    </div>



    <h3 class="titolo">Titolo 2</h3>



    <div class="content">

        Contenuto 2

    </div>

    

    <h3 class="titolo">Titolo 3</h3>



    <div class="content">

        Contenuto 3

    </div>

    

</div>



</body>

</html>

**Vindav** · 06-10-2011, 14:19

prova cosi:

codice:

i=1;

setInterval(cicla,5000);

function cicla(){
	var obj = $('div.accordion> h3.titolo').get(i);
	$(obj).next('div').slideToggle('fast').siblings('div:visible').slideUp('fast');
	if(i>= $('div.accordion> h3.titolo').length) i=0;
	else i++;
}

Il plugin timers non l'ho guardato magari è piu semplice utilizzare quello

**fra_ore_90** · 06-10-2011, 14:44

Grande funziona! Però ora (non mi voglio "allargare" come si suol dire, io chiedo se qualcuno ha tempo e voglia di aiutarmi ben venga!), dicevo vorrei 2 modifiche.

La prima che quando passo sopra uno dei div .content con il mouse il ciclo si fermi (onMouseover) e che quando lo tolgo ricominci.

e la seconda se sia possibile espandere un div cliccando sul proprio elemento h3.title!

Grazie a chi mi aiuta!

Discussione: Jquery - Autorotation Accordion

Strumenti discussione

Ricerca discussione

Visualizza

Jquery - Autorotation Accordion

Permessi di invio