如何創建一個水平的JQuery 1.9菜單？

Question

JQuery UI 1.9有一個非常方便的功能來創建一個菜單。但是這個菜單是一個垂直菜單。有沒有人用JQuery 1.9創建一個水平菜單？

UPDATE

我添加的頁面

<ul id="nav"> 
    <li><a href="#">Item #1</a></li> 
    <li><a href="#">Profile</a> 
    <ul> 
     <li><a href="#">Ada</a></li> 
     <li><a href="#">Saarland</a></li> 
     <li><a href="#">Salzburg</a></li> 
    </ul> 
    </li> 

</ul> 

我下面的代碼添加到CSS：

的.ui菜單：{後內容 ： 「」; display：block; 明確：均; 知名度：隱藏; line-height：0; 身高：0; }

.ui-menu .ui-menu-item { display：inline-block; float：left; margin：0; 填充：0; 寬度：自動; }

CSS爲Item＃1和Profile創建了一個水平菜單。然而，CSS無法使Ada，Saarland和Salzburg成爲Profile的下拉菜單。

任何人有任何建議嗎？

Answer 1

從How to make jQuery UI nav menu horizontal?

可能的複製，但你絕對可以做到這一點：它不是一個jQuery的問題，你只需要樣式化受影響的CSS元素，它們是.ui-menu和.ui-menu-item類。

Answer 2

您可以使用相同的HTML語法（li's等）創建菜單，然後按CSS組織顯示。這是我做到的方式。您可以將UI處理添加到菜單的元素以提供效果。

Answer 3

根據jquery ui文檔，沒有使其水平的API。 但是你可以使用一些CSS，使其水平容易：

http://coderevision.com/how-to-have-a-jquery-ui-menu-displayed-horizontally/