Magento: Show Top Level Products on Homepage without Hovering

Question

I'm looking to have our top nav on the homepage already "flown-out" or expanded. And, when the customer navigates to any other pages it would be collapsed or hidden, and would only show when hovered overed. I'm looking to achieve an effect similar to Amazon Supply:

Homepage: http://www.amazonsupply.com/

When Navigated: http://www.amazonsupply.com/s/2233994011/ref=gw_c_ht

Does anyone have an idea of how I could achieve this within Magento?

Currently I have 'All Products' as the top level category with all of my main categories as subcats, so I get just "All Products" on the top with the fly-out.

Answer 1

The body element on the homepage has the class cms-index-index. You can use that to set some styles only for homepage.
Add in one of your css files something like this:

.cms-index-index #nav .level-1{display:block}

Don't take the styles above for granted. I'm almost sure it won't work on your website, but I hope you get the idea.