首页>>导航菜单>>各种下拉菜单 ，多级下拉菜单，向上展开菜单 左侧展开菜单(2014-02-23)

各种下拉菜单 ，多级下拉菜单，向上展开菜单 左侧展开菜单

各种下拉菜单 ，多级下拉菜单，向上展开菜单 左侧展开菜单
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <ul id="idmenu">  
  2.             <li><a href="#" id="idTestLink"><span>File</span></a>  
  3.                 <ul>  
  4.                     <li><a href="#" ><span>New</span></a></li>  
  5.                     <li><a href="#" ><span>Open</span></a></li>  
  6.                     <li><a href="#" ><span>Open Recent</span></a>  
  7.                         <ul>  
  8.                             <li>/home/user/documents/mnmenu-userguide.pdf</li>  
  9.                             <li>/home/user/documents/TakingOverTheWorldIn10days.pdf</li>  
  10.                             <li>/home/user/documents/WorldDominationForDummies.pdf</li>  
  11.                             <li>/home/user/documents/HowToUninstallWindows.pdf</li>  
  12.                         </ul>  
  13.                     </li>  
  14.                     <li><hr></hr></li>  
  15.                     <li><a href="#" ><span>Save</span></a></li>  
  16.                     <li><a href="#"><span>Save as...</span></a></li>  
  17.                     <li><a href="#" ><span>Quit</span></a></li>  
  18.                 </ul>  
  19.             </li>  
  20.             <li><a href="#" id="id31"><span>Sales</span></a>  
  21.                 <ul>  
  22.                     <span>  
  23.                         <li><a href="#" id="id32"><span>Accounts</span></a></li>  
  24.                         <li><a href="#" id="id33"><span>Companies</span></a></li>  
  25.                         <li><a href="#" id="id34"><span>Leads</span></a></li>  
  26.                         <li><a href="#" id="id35"><span>Activities</span></a>  
  27.                             <ul>  
  28.                                 <li><a href="#" id="id36"><span>Calls</span></a></li>  
  29.                                 <li><a href="#" id="id37"><span>Tasks</span></a></li>  
  30.                                 <li><a href="#" id="id38"><span>Meetings</span></a></li>  
  31.                             </ul>  
  32.                         </li>  
  33.                     </span>  
  34.                 </ul>  
  35.             </li><li><a href="#" id="id39"><span>Master</span></a>  
  36.                 <ul>  
  37.                     <li> <a href="#" id="id3a"><span>Company</span></a></li>  
  38.                     <li><a href="#" id="id3b"><span>System</span></a>  
  39.                         <ul>  
  40.                             <li><a href="#" id="id3c"><span>Places</span></a>  
  41.                                 <ul>  
  42.                                     <li><a href="#" id="id3d"><span>Countries</span></a></li>  
  43.                                     <li><a href="#" id="id3e"><span>States</span></a></li>  
  44.                                     <li><a href="#" id="id3f"><span>Postal Codes</span></a></li>  
  45.                                 </ul>  
  46.                             </li>  
  47.                             <li><a href="#" id="id40"><span>Currency</span></a></li>  
  48.                             <li><a href="#" id="id41"><span>Taxes</span></a></li>  
  49.                             <li><a href="#" id="id42"><span>Invoice Series</span></a></li>  
  50.                         </ul>  
  51.                     </li>  
  52.                     <li>  
  53.                         <a href="#" id="id43"><span>Issues</span></a>  
  54.                         <ul><li><a href="#" id="id44"><span>Types</span></a></li>  
  55.                             <li><a href="#" id="id45"><span>Solutions</span></a></li>  
  56.                         </ul>  
  57.                     </li>  
  58.                     <li><a href="#" id="id46"><span>Users</span></a></li>  
  59.                 </ul>  
  60.             </li>  
  61.             <li>  
  62.                 <a href="#">Menu</a>  
  63.                 <ul>  
  64.                     <li><a href="#">Level M-1</a></li>  
  65.                     <li><a href="#">Level M-2</a></li>  
  66.                     <li><a href="#">Level M-3</a></li>  
  67.                     <li><a href="#">Level M-4</a></li>  
  68.                     <li><a href="#">Level M-5</a></li>  
  69.                     <li>  
  70.                         <a href="#">Level M-6</a>  
  71.                         <ul>  
  72.                             <li><a href="#">Level M-6-1</a></li>  
  73.                             <li><a href="#">Level M-6-2</a></li>  
  74.                             <li><a href="#">Level M-6-3</a></li>  
  75.                             <li><a href="#">Level M-6-4</a></li>  
  76.                         </ul>  
  77.                     </li>  
  78.                     <li><a href="#">Level M-7</a></li>  
  79.                     <li><a href="#">Level M-8</a></li>  
  80.                     <li><a href="#">Level M-9</a></li>  
  81.                     <li><a href="#">Level M-10</a></li>  
  82.                 </ul>  
  83.             </li>  
  84.             <li>  
  85.                 <a href="#" id="id47"><span>Web</span></a>  
  86.                 <ul>  
  87.                     <li><a href="#" id="id48"><span>Log</span></a></li>  
  88.                     <li><a href="#" id="id49"><span>Texts</span></a></li>  
  89.                     <li><a href="#" id="id4a"><span>Categories</span></a></li>  
  90.                     <li><a href="#" id="id4b"><span>Articles</span></a></li>  
  91.                     <li><a href="#" id="id4c"><span>Files</span></a></li>  
  92.                 </ul>  
  93.             </li>  
  94.         </ul>  

 


原文地址:http://www.freejs.net/article_daohangcaidan_274.html