My Own jQuery Accordion

Question

Hey ragazzi, ho creato la seguente struttura dei menu:

<div id="menu">
<ul>
<li><a href="#">Main Item1</a></li>
<li><a href="#">Main Item2</a></li>
<li><a href="#">Main Item3</a>
    <ul>
    <li><a href="#">SubItem for MainItem3</a></li>
    <li><a href="#">2ndSub for MainItem3</a></li>
    </ul>
</li>
<li><a href="#">Main Item4</a>
    <ul>
    <li><a href="#">SubItem for MainItem4</a></li>
    <li><a href="#">2ndSub for MainItem4</a></li>
    </ul>
</li>
</ul>
</div>

Ecco, questo è il mio struttura del menu. Ora voglio usare jQuery recente per rendere l'effetto slideUp / slideDown.

Lo faccio in questo modo:

$(document).ready(function(){
    $('#menu ul li:has(ul)').mouseenter(function(){         
                $('#menu ul li ul').slideDown('slow');                              
    }).mouseleave(function(){
        $('#menu ul li ul').slideUp('slow');
    });
});

ho provato mouseover e mouseout, ma quando ho usato quella funzione, il passaggio del mouse lavorato e quando ho voluto andare al Sub, il menu fatto scorrere in su, ma mouseOut occours eventi. Ora ha funzionato, ma quando mi passa il mouse per esempio sul punto principale 3, il Subs anche dalla voce principale 4 aprono e si chiudono sul mouseout?!?! Come a dire solo le voci del menu di esempio Voce principale 3 oder Voce principale 4 ???

Spero che tu capisca cosa voglio dire?

Grazie

Answer 1

$(function(){
    $('#menu ul li:has(ul)').hover(function(){                 
            $(this).find('ul').slideDown('slow');                                                          
    }, function(){
            $(this).find('ul').slideUp('slow');
    });
});