why isn't this menu code working? (cooljsmenu pro version)

[g8z]

Hello,

I am using the Pro version of cooljsmenu. A live test of the menu can be viewed at:

http://www.tufat.com/jsmenu/

If you look at the source code, which I've duplicated below, you'll see that there should be:

1 first-level menu ("Top Level")
3 second-level menus (Items 1,2,3)
2 third-level menus (Items 4,5)

However, only 2 second-level menus are showing, and only 1 third-level menu is showing.

Could anyone give me some insight as to why Items 1 and 4 are not appearing? Thanks in advance!

Here's the exact soure code:

<script type="text/javascript" src="coolmenu.js"></script>
<script language=Javascript>
var STYLE_top_level_style = {
"border":1,
"shadow":2,
"color":{"border":"#666666", "shadow":"#DBD8D1", "bgON":"white","bgOVER":"#B6BDD2"},
"css":{"ON":"top_level_style", "OVER":"top_level_style"}
};
var STYLE_sub_level_1 = {
"border":1,
"shadow":2,
"color":{"border":"#666666", "shadow":"#DBD8D1", "bgON":"white","bgOVER":"#B6BDD2"},
"css":{"ON":"sub_level_1", "OVER":"sub_level_1"}
};
var STYLE_sub_level_2 = {
"border":1,
"shadow":2,
"color":{"border":"#666666", "shadow":"#DBD8D1", "bgON":"white","bgOVER":"#B6BDD2"},
"css":{"ON":"sub_level_2", "OVER":"sub_level_2"}
};
var DEFAULT = {
"border":1,
"shadow":2,
"color":{"border":"#666666", "shadow":"#DBD8D1", "bgON":"white","bgOVER":"#B6BDD2"},
"css":{"ON":"default", "OVER":"default"}
};

var MENU_ITEMS = [
{pos:[10, 20], itemoff:[21,0], leveloff:[11,110], style:DEFAULT, size:[22,120]},
{code:"Top level", url:"top_level_link.html", format:{style:STYLE_top_level_style},
sub:[
{code:"Item 1", url:"item1.html", format:{style:STYLE_sub_level_1}},
{code:"Item 2", url:"item2.html", format:{style:STYLE_sub_level_1}},
{code:"Item 3", url:"item3.html", format:{style:STYLE_sub_level_1},
sub:[
{code:"Item 4", url:"item4.html", format:{style:STYLE_sub_level_2}},
{code:"Item 5", url:"item5.html", format:{style:STYLE_sub_level_2}},
]
},
]
},
];

var menu = new COOLjsMenuPRO('menu', MENU_ITEMS);

menu.initTop();
menu.init();
menu.show();

</script>

[AlexKunin]

Every "sub:[...]" is not just a list of items. First element in the square brackets is holder for properties which will be shared by all subitems in this particular submenu: size, itemoff, leveloff, style, etc. So, minimal changes to get your menu working are: