如何在此菜單欄上應用手風琴jquery效果？

Question

我想對這段代碼應用手風琴效果，但我是JQuery的初學者。有人能幫助我嗎？

<div id="left_menu"> 
      <ul id="main_menu" class="main_menu"> 
       <li class="limenu" ><a href="dashboard.html"><span class="ico gray shadow home" ></span><b>Dashboard</b></a></li> 
       <li class="limenu select" ><a href="#" ><span class="ico gray shadow window"></span><b>Form elements</b></a> 
        <ul> 
         <li ><a href="form.html"> basic form </a></li> 
         <li ><a href="vform.html"> validation </a></li> 
         <li ><a href="wizard.html"> wizard </a></li> 
        </ul> 
       </li> 
       <li class="limenu" ><a href="#"><span class="ico gray dimensions" ></span><b>Sample pages</b></a> 
        <ul> 
         <li ><a href="profile.html"> Profile setting </a></li> 
         <li ><a href="conversation.html"> conversation</a></li> 
         <li ><a href="imagesEditor.html"> Images Editor </a></li> 
        </ul> 
       </li> 
       <li class="limenu" ><a href="table.html"><span class="ico gray shadow spreadsheet"></span><b>Tables</b> </a></li> 
       <li class="limenu" ><a href="gallery.html"><span class="ico gray shadow pictures_folder"></span><b>Gallery </b></a></li> 
       <li class="limenu" ><a href="#"><span class="ico gray shadow stats_lines"></span><b>Graph and Charts</b> </a> 
        <ul> 
         <li><a href="modalchartLive.html" class="pop_box">live chart </a></li> 
         <li><a href="chart.html">all chart</a></li> 
        </ul> 
       </li> 
       <li class="limenu" ><a href="filemanager.html"><span class="ico gray shadow file"></span><b>File manager </b></a></li> 
       <li class="limenu" ><a href="calendar.html"><span class="ico gray shadow calendar"></span><b>Calendar </b></a></li> 
       <li class="limenu" ><a href="typography.html"><span class="ico gray shadow paragraph_align_left"></span><b>Typography</b></a></li> 
       <li class="limenu" ><a href="inelement.html"><span class="ico gray shadow abacus"></span><b>Interface elements </b></a></li> 
       <li class="limenu" ><a href="map.html"><span class="ico gray shadow location"></span><b>Map location </b></a></li> 
       <li class="limenu" ><a href="icon.html"><span class="ico gray shadow satellite"></span><b>Icon and Button </b></a></li> 
       <li class="limenu" ><a href="404.html"><span class="ico gray shadow firewall"></span><b>Error Pages</b></a></li> 

      </ul> 
     </div> 

Answer 1

你可以使用jQuery UI就像這樣：http://jsfiddle.net/J5jg4/

Answer 2

你真的應該符合API中列出的HTML格式：

JqueryUI Accordion

因此，這意味着一個標題標籤名稱部分和div將手風琴部分直接劃分在標題之後。

但坦率地說，我不確定手風琴是您在這裏尋找的。如果我明白你想要完成的是什麼，難道你不想要一個簡單的下拉菜單嗎？

jQuery Dropdown Menu Plugin