How to make jQuery UI nav menu horizontal?

Question

I love the jQuery UI stuff!

I like the navigation menu, but I can\'t seem to get it horizontal. I\'ve got to be missing something that\'s a cinch.

Anyone kno

Answer 1

To get a horizontal nav bar with vertical dropdowns, use a combination of a table and unordered lists.

The level 1 items are represented by table cells, subsequent levels are represented by unordered lists.

The positioning of the child menus was a problem. The default is to have them appear directly alongside, but when on a top level item, that was obscuring the subsequent items in the horizontal nav bar. Having them appear below was ok for a single dropdown menu, but if there was a second level beneath, then that 2nd level would obscure the rest of the first. The solution is to have the menu open below and somewhat to the right, see the "position" option in the menu invocation.

  

    

      Timesheets
      

        
Labour
        
Chargeout Report
      
    
    

      Activity Management
      

        
Activities
        
Proposals