View Full Version : Resolved Submenu is not expanding on All Levels Navigational Menu

12-20-2008, 05:03 AM
1) Script Title: All Levels Navigational Menu (v1.5)

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

3) Describe problem: For some reason, the submenus on my site won't expand.
If you look at my site, there are two buttons to click on; The first one is titled:Products on this page.
The second button is titled: Products on this site.

It is the second button or menu that I have the problem with.

I cannot find the answer to the problem because as far as I know the lists and sublists are set up correctly.

The following changes have already been made when seting up this script on my page:

1. ddlevelsmenu.js file was changed to work on click and not mouse hover. (File is attached to this post) - Is it possible to have only submenus expand on hover?

2. Right arrow pointers were removed from the top level buttons by commenting out this line of code:

//this.addpointer(menuitem, arrowpointer, this[arrowpointer], (dir=="sidebar")? "before" : "after")

3. Disabled hyperlink for the top Level buttons by adding the code that is in red:

if (istoplevel){
this.addEvent(header, function(e){
return false
}, "click")

If anyone can help with either the html or make a suggestion as to how to change the ddlevelsmenu.js file that would be great because I can't seem to find the source of the problem after looking at my html code, css style sheets and don't know enough to find and edit what may be needed in the .js file.

URL for the page is:
There is no link here now as the page is no longer needed.


12-21-2008, 08:19 AM
I'm guessing it's because step 3 is only for top level menus. You could try to get it to work for the second level in the JavaScript file or adding this to the problematic links might help:

<a href="#" onclick="return false">Submenu</a>

However, I'm quite a beginner when it comes to JavaScript so maybe John or DDAdmin or someone else can help you out with this (i.e. bump).

12-21-2008, 09:00 AM
Thanks for replying,
unfortunately, no change was effected by trying your advice.
Step 3. was to stop the buttons from hyperlinking and sending me to an error page.
In this case the submenus don't hyperlink at all.
I'm just not getting anything to expand on the 3rd level submenu.

Top level opens to reveal the second level and there are rightarrow pointers for the 3rd level submenu but neither hovering the mouse or clicking on the 2nd level activates the 3rd level to expand.

Oh well....

If anyone else can help....?


12-21-2008, 11:30 AM
There's no easy way to modify the menu so just the top level headers are activated onClick, and the sub headers onMouseover instead. It's all or nothing in that sense. If you're willing to go with a set up where all headers are activated onClick, try the below modified .js file.

12-22-2008, 03:00 AM
Thankyou for your help as my problem is now solved. I am just as happy to have the click function on the submenus as opposed to them not working at all!

I am extremely gracious for your help as I know next to nothing about javascript coding and you have made my nightmare turn into dream.

I compared scripts to see if I could learn anything and saw the new addition to the script.
I still didn't learn anything from the new code but maybe one day I can learn properly!:confused::)

I will now add the new script at my original post for other people to use if they want to change the mouse over to onclick.

The script can be found at:


12-22-2008, 03:40 AM
You're welcome. :)

01-15-2009, 08:20 AM
First, thanks to DynamicDrive for this very good script, and for the rest as well.

So I've been trying this custom script allowing the onClick event to be used to display menus instead of the rollover one.

I get that expected behaviour, which is the nice part. But life is not nice.

My sub-sub-nested items links don't work anymore. The links are there, they show on hover in the status bar, but clicking on them doesn't load the linked page. Menu disappears, and nothing. The sub-nested items do work on the contrary.

Let me put that in code :

<div id="ddtopmenubar" >
<li><a href="#" rel="ddsubmenu_1"> Example </a></li>
<script type="text/javascript">
ddlevelsmenu.setup("ddtopmenubar", "topbar")
<ul id="ddsubmenu_1" class="ddsubmenustyle">
<a href="#"> Example </a>
<li><a href="http://">Working !</a>
<li><a href="http://">Not working !</a></li>

What do you think ?