Help with JQuery With Menu

Question

Hey Imgに埋め込まれたリストを持つメニューを作成しようとすると、セカンダリリストがスライドされたり、リストがフェードインしたりします。すべてこれまでの動作はJQueryの効果が必要です。

<div id="nav"> 
    <ul> 
     <li> 
     <h2>YEKTY</h2> 
     <ul> 
      <li>HOME</li>   
      <li>ABOUT US</li>   
      <li>WHO ARE WE?</li> 
      </ul> 
     </li> 
    </ul> 
    <ul> 
     <li> 
     <h2>LINKS</h2> 
     <ul> 
      <li>YTU</li> 
      <li>IPICCO ME</li> 
     </ul> 
     </li> 
    </ul> 
    <ul> 
     <li> 
     <h1>INFO</h1> 
     <ul> 
      <li>CONTACT</li> 
     </ul> 
     </li> 
    </ul> 
    </li> 
    </ul> 
    </div> 

とCSSは次のとおりです：私のhtmlがある私は、私がいることを投稿することはできませんが、<li>要素内のリンクがあり、ちょうど効果CSSやHTMLとの助けを必要としません

/******NAVIGATION******/ 
div#nav { 
width: 100%; 
background: transparent; 
float: left; 
text-align:center; 
} 

#nav ul { 
list-style: none; 
margin: 0; 
width:100px; 
padding: 0px; 
float: left; 
cursor:pointer; 
} 
#nav ul h1 { 
width:112px; 
} 
#nav a, #nav h2, #nav h1 { 
font: bold 11px/16px arial, helvetica, sans-serif; 
display: block; 
margin: 0; 
} 
#nav h2 { 
color: #fff; 
background: #000 url(images/nav_bg_flip.png); 
text-transform: uppercase; 
} 
#nav h1 { 
color: #fff; 
background:#000 url(images/nav_bg_flip.png); 
text-transform: uppercase; 
-moz-border-radius: 0 0 90px 0; 
-webkit-border-radius: 0 0 90px 0; 
border-radius: 0 0 90px 0; 
} 
#nav a { 
color: #fff; 
background: #000; 
text-decoration: none; 
} 
#nav a:hover { 
color: #fff; 
background: #a9a9a9; 
} 
#nav h2:hover { 
color:#fff; 
opacity:0.7; 
} 
#nav h1:hover { 
color:#fff; 
opacity:0.7; 
} 
#nav li { 
position: relative; 
} 
#nav li li a { 
opacity:0.7; 
} 
#nav li li a:hover { 
opacity:0.9; 
background:#464646; 
} 
#nav ul ul { 
position: absolute; 
} 
div#nav ul ul, div#nav ul li:hover ul ul{ 
display: none; 
} 
div#nav ul li:hover ul{ 
display: block; 
} 
/******END NAVIGATION******/ 

たくさんの。ありがとう！

Answer 1

ような何か：もちろん、S 'のあなたはh2にカーソルを合わせると表示するようにS' のあなたがulをしたいと仮定すると、

$('#nav ul h2').hover(function() { 
    $(this).nextAll('ul:first').slideDown(); 
}, function() { 
    $(this).nextAll('ul:first').slideUp(); 
}); 

;）ホバー機能について

ドキュメントはここにある：http://api.jquery.com/hover/

編集：私もこれを試してみるつもりだったが、jsfiddleは私がどこにいるのか不安定であるようだ。私はそれがあなたのために働くことを願っています。

EDIT：コメントで提案されているように、これは良い仕事があります。

$('#nav>ul>li').hover(function() { 
    $('ul:first', this).slideDown(); 
}, function() { 
    $('ul:first', this).slideUp(); 
});