in_rpt_hell
asked on
jQuery Horizontal Dropdown Menu with a Slight Twist
Hello,
I'm working on a dropdown menu that has 3 levels, but when the 1st level is expanded, both the 2nd and 3rd need to show. I have all the markup and CSS the way it needs to be so it looks perfect. The only issue is that I can't seem to modify this jQuery script to leave the 3rd level expanded when hovering off and on the 2nd level menu.
The way it works now, is that you hover over the first, and both the 2 and 3rd show. This is good. The problem is as you hover over the rest of the items, and on and off the 2nd level ul.dropdown, the script hides the 3rd level menu. I've tried using :not, parents, children to exclude the 3rd level, and I know this should be easy, but I guess I just suck at jQuery I guess because it's not working.
Also, I cannot change the classes of the <ul> because they are being controlled by a CMS.
I've attached a txt file with a working example of the markup, CSS and script - just change the extension to html. The jQuery in question is in the <head> section. Any help would be greatly appreciated ;)
Thank you!
dropdown.txt
I'm working on a dropdown menu that has 3 levels, but when the 1st level is expanded, both the 2nd and 3rd need to show. I have all the markup and CSS the way it needs to be so it looks perfect. The only issue is that I can't seem to modify this jQuery script to leave the 3rd level expanded when hovering off and on the 2nd level menu.
The way it works now, is that you hover over the first, and both the 2 and 3rd show. This is good. The problem is as you hover over the rest of the items, and on and off the 2nd level ul.dropdown, the script hides the 3rd level menu. I've tried using :not, parents, children to exclude the 3rd level, and I know this should be easy, but I guess I just suck at jQuery I guess because it's not working.
Also, I cannot change the classes of the <ul> because they are being controlled by a CMS.
I've attached a txt file with a working example of the markup, CSS and script - just change the extension to html. The jQuery in question is in the <head> section. Any help would be greatly appreciated ;)
Thank you!
dropdown.txt
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER