View Full Version : Resolved All Levels Navigational Menu (v2.2) Implementation Issues

07-26-2009, 09:41 PM
1) Script Title: All Levels Navigational Menu (v2.2)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/ddlevelsmenu/index.htm

3) Describe problem:

I have been trying to implement the above script at www.arbwebdesign.com/~sr/ (please note that the site is not live, and I've just begun putting it together). I've followed the instructions exactly and checked my CSS closely to make sure all elements are there. I've been able to successfully implement scripts from this site before, so I like to think I'm not incompetent, but I must be missing something with this one (and get the feeling I'll feel ridiculous).

The biggest issue is that when I rollover one of the title menu options, the submenu appears as it is supposed to, but disappears when I move my mouse down to attempt to click on a submenu option. It does this in both Firefox 3 and IE 8.

Also, I've disabled the arrow pointers in the script, but what resembles an underscore still exists in IE, as if a pointer should be there. The submenus align to that element, instead of the li of the main menu.

Perhaps I should bring this up in a separate thread, but my end goal is to make the menu function by clicking instead of mouseover. I've been able to find a few things in the forums, but none are for the current version and seem to cause more issues than good. Will I have to change much of the JS file?

For reference, my CSS file is located at www.arbwebdesign.com/~sr/settings/main.css and the JS file is at www.arbwebdesign.com/~sr/settings/ddlevelsmenu.js

Many thanks in advance for your help!

07-28-2009, 01:40 AM
After playing around for a while, I figured out why the menu was disappearing.

For aesthetics, I was trying to offset the submenu from the menu item <li> elements by means of a top margin. Quite stupid in retrospect, as it caused my mouse to "leave" the defined menu area in the small space between the menu and submenu.

This curiously solved my IE issue, as well.

I'd still love some insight into making the menu appear by clicking rather than mouseover, if anyone can help. Reading through the JS, it seems that it'd be simple, but JS is my weakest ability in coding. As I mentioned, I did find a lot in searching, but all of the versions I've found are old and end up causing more issues.


07-28-2009, 04:29 PM
With regards to modifying the script so the sub menus are revealed onclick, this is fairly easy if all you wish is the main headers to be activated via onClick, with the sub levels still revealed onMouseover. With that said, try the below modified .js file.

07-28-2009, 10:21 PM
Works perfectly, thank you.