I would like to create a slidedown menu similar to the one that can be seen here…
The main points are:
• submenu slides down when main nav item is clicked, not on hover
• submenu stays open until another top level menu item is clicked, which makes the first submenu slide closed and the new submenu slide open
• active items in top level menu and submenu are highlighted.
• when a page linked to from a submenu loads, it’s submenu is visible.
I’m afraid when it comes to JS/jQuery, while I’m usually capable of modifying existing plugins to fit my needs like superfish etc, I’m not able to roll my own yet.
Unfortunately I can’t seem to find an existing plugin that basically does what I want on this occasion…
Can anyone help me with this please?
My HTML looks like this
Can no one offer any help with this one?
If anyone knows a plug-in that would be a good starting point for what I need that would be useful - I have looked but no luck. Spoilt for choice on hover plug ins but none seem to do onclick.
If not, then I guess I’ll try building what I need from scratch. I’m currently on chapter 3 of Sitepoint’s jQuery: Novice to Ninja…Menu’s are chapter 5. Bring it on.
Visit jquery.com and download the files, also visit the tutorials page (link) where they have a number of ideas and scripts to use.
This might be what your after on this page
Other effects can be found here
thank you for taking the time to give me some pointers - there’s definitely some useful stuff there.
I have skipped to the menus chapter of the jQuery - Novice to Ninja book and I am making some progress, but still quite a way to go.
I have worked out how to make my menus slide down and also how to make a menu load in it’s open state when it is active (but haven’t got those two things working together yet!) also haven’t managed to get a menu to close when another one opens yet either. Will keep trying and post my progress here in the next couple of days - have to work on something else right now…