You will recieve your password to this address. Address is not made public.

Your preferred username that is used when logging in.

Modifying tabs to work like a "Mega Menu" Created Mar 7, 2010

This thread is solved

Views: 2496     Replies: 3     Last reply Mar 28, 2010  
You must login first before you can use this feature

kurdt_the_goat

Posts: 2

Registered:
Mar 7, 2010

Modifying tabs to work like a "Mega Menu"

Posted: Mar 7, 2010

Hi. I'm wondering if anyone has an example of Tabs usage where it's been changed to function like a "Mega Menu". That is...

a) no tab content appears on initial load
b) tab content appears on hover over tab, disappears with fade delay after mouse out
c) tabs retain their hover state when the tab content is visible (so the menu appears connected to the tab)

Basically, exactly like this site:http://www.actionenvelope.com/ (i don't want to use mootools :)

I'm not really sure where to start so any help would be appreciated.
This strikes me as a demo i'd have thought would already be on the main site!

sghiassy

Posts: 4

Registered:
Mar 11, 2010

» Modifying tabs to work like a "Mega Menu"

Posted: Mar 20, 2010

Reply to: Modifying tabs to work like a "Mega Menu", from kurdt_the_goat
Check out

http://www.sitepoint.com/blogs/2009/03/31/make-a-mega-drop-down-menu-with-jquery/

They don't use jQuery Tools per-se but it works good

kurdt_the_goat

Posts: 2

Registered:
Mar 7, 2010

» » Modifying tabs to work like a "Mega Menu"

Posted: Mar 22, 2010

Reply to: » Modifying tabs to work like a "Mega Menu", from sghiassy
Thanks, i have seen that tutorial before but asked here because i was hoping to minimise my JS includes.

128bit

Posts: 14

Registered:
Dec 9, 2009

Use a CSS menu

Posted: Mar 28, 2010

Reply to: Modifying tabs to work like a "Mega Menu", from kurdt_the_goat
I just completed one using only css and will the nice thing here is that the 5% of the users to the site that disable javascript will still use the menus.

http://www.istoresinc.com/pbol

you can take a look at the source code and find menu.css and see what I did. basically use use the :hover pseudo class.

•