Sottomenù a scorrimento

Ho un menù realizzato con list e vorrei che al clic su determinati bottoni si aprissero dei sottomenù (realizzati anch'essi con list) scorrendo verso il basso. Come posso creare questo effetto "scorrimento"?

Ciao dovresti utilizzare JQuery, un codice base potrebbe essere:

Codice HTML:

---

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
                        function Cascade(delay){
                                // Clear the existing elements as
                                // we're doing this muliple times.
                                $('#cascade').html('');
                                // Initiate an array
                                var items = ['Testo1','Testo2','Testo3',];
                                // Loop through it with jQuery.each()
                                $(items).each(function(i, html){
                                        // Create a new DIV.
                                        item = $('<div></div>');
                                       
                                        // Give it a class for styling
                                        $(item).addClass('item');
                                       
                                        // Add our html code from the array.
                                        $(item).html(html);
                                       
                                        // Make it so it doesn't display
                                        // when it's added to the DOM.
                                        $(item).css({ //CSS a caso, solo per farti capire
                                                'display': 'none',
                                                'font-size': '1em',
                                                'padding-top': '5%',
                                        })
                                       
                                        // Tell jQuery to delay the fadeIn by i * delay,
                                        // (no. times loop has iterated) * (delay in ms)
                                        $(item).delay(i * delay).fadeIn();
                                       
                                        $('#cascade').append(item);
                                });
                        }
                </script>

---

Una volta scritto questo script dovrai passargli il tempo di "attesa" nel tuo html e determinare lo spazio dove dovrà apparire:

Codice HTML:

---

<button onclick="doCascade(150)">
<!-- All'interno della parentesi passi il parametro che determinerà il tempo di scorrimento -->
                <span>Schiaccia per far apparire</span>
</button>
                <div id="cascade">
                </div>

---

In questo modo dovrebbe andare, essendo un codice "lungo" se non capisci qualcosa dimmelo ed evito di spiegarlo tutto casomai :tongue

Ma se io ho

Codice:

---

<li>Voce1</li>
<li>Sottovoce1</li>
<li>Sottovoce2</li>

---

Devo farlo diventare

Codice:

---

<li onclick="doCascade(150)">Voce1</li>
<div="cascade">
<li>Sottovoce1</li>
<li>Sottovoce2</li>
</div>

---

?

Mi era stato detto che non vanno inseriti div all'interno del list...

Ciao, nono.. dovresti lasciare l'html come ti ho postato sopra e modificare l'array (una possibile soluzione) in questo modo:

Codice HTML:

---

var items = ['<li>Sottovoce1</li>','<li>Sottovoce2</li>'];

---

Fammi sapere :tongue

Credevo di avercela fatta...ma ho appena scoperto che su InternetExplorer (versione 10) non funziona...cosa posso fare?

LINK: cliccando su poesia dovrebbe scendere il sottomenù ma con IE non succede niente...