Sub-Menu width same as top menu and hide "Hand" mo

Poster: DaveW
Dated: Tuesday November 18 2003 - 16:08:51 GMT

I want my submenu items to have the same width as the main menu items. I have tried using the itemwidth= property to set both but they do not work when you have padding, is there an easy way to control this.

Also for the top level menu items that the user cannot click on to go anywhere, I do not want the mousepointer to be a hand. I tried playing with type=header but this does not highlight the top menu on the mouseover. I only want the 'hand' to appear for items the user can click on and go somewhere. I also tried decoration and ondecoration but these did not work for me.

Thanks,
Dave.

Poster: kevin3442
Dated: Wednesday November 26 2003 - 0:33:40 GMT

I'm not sure why itemwidth wouldn't work. I tried it and it semed to work OK for me, even with padding. Do you happen to have a test page we can look at?

Regarding the pointer issue, there is a menu item property called pointer that you can use to specify the pointer you want to appear when mousing over a menu item. The following menu item definition opens a submenu, but has no url of its own, so the pointer setting of 'default' should leave the browser's default pointer in place when mousing over the item.

The default pointer is usally the arrow. If you want to be specific, you could use pointer=arrow; instead.

Hope that helps,

Kevin

Problems with menu width

Poster: DaveW
Dated: Monday December 1 2003 - 15:03:33 GMT

The link is http://www.missingmoney.com/mmdev/Main/Index.cfm, and the code to display this is as follows (Cold Fusion, the #...# gets substituted at runtime):


<cfoutput>
<script language="JavaScript">
_menuCloseDelay=100 // The time delay for menus to remain visible on mouse out
_menuOpenDelay=30 // The time delay before menus open on mouse over
_followSpeed=5 // Follow scrolling speed
_followRate=40 // Follow scrolling Rate
_subOffsetTop=0 // Sub menu top offset
_subOffsetLeft=0 // Sub menu left offset
_scrollAmount=3 // Only needed for Netscape 4.x
_scrollDelay=20 // Only needed for Netcsape 4.x

with(menuStyle=new mm_style()){
onbgcolor="##FFFFFF";
oncolor="##990033";
offbgcolor="##333366";
offcolor="##FFFFFF";
bordercolor="##333366";
borderstyle="solid";
borderwidth=2;
separatorcolor="##cccccc";
separatorsize="1";
padding=5;
fontsize="12px";
fontstyle="normal";
fontfamily="Arial, Helvetica, Verdana";
fontweight="Normal";
pagecolor="##FFFFFF";
pagebgcolor="##333366";
headercolor="##FFFFFF";
headerbgcolor="##333366";
subimage="../Menu/arrow_down.gif";
subimagepadding="2";
overfilter="Fade(duration=0.2);Alpha(opacity=100)";
outfilter="";
}


with(milonic=new menuname("Main Menu")){
style=menuStyle;
top=0;
left=0;
alwaysvisible=1;
orientation="horizontal";
position="relative";
aI("text=Home;url=#MMpathNormal#/Main/Index.cfm;status=Return To Home Page;itemwidth=80;align=center");
aI("text=Links;showmenu=Links;itemwidth=100;align=center;");
aI("text=General;showmenu=General;itemwidth=115;align=center");
aI("text=Help;showmenu=Help;itemwidth=116;align=center");
aI("text=My Profiles;showmenu=Profiles;itemwidth=160;align=center");
}

with(milonic=new menuname("Links")){
style=menuStyle;
aI("text=NAUPA;url=#MMpathNormal#/Main/Links.cfm?Target=Naupa;target=_blank;status=Link to the National Association of Unclaimed Property Administrators;itemwidth=90");
aI("text=State Sites;url=#MMpathNormal#/Main/.cfm;Target=_top;status=");
aI("text=Related Links;url=#MMpathNormal#/Main/.cfm;Target=_top;status=");
aI("text=Tell A Friend;url=#MMpathNormal#/Main/.cfm;Target=_top;status=");
}

with(milonic=new menuname("General")){
style=menuStyle;
aI("text=What's Here;url=#MMpathNormal#/Main/.cfm;Target=_top;status=;itemwidth=115");
aI("text=Who We Are;url=#MMpathNormal#/Main/.cfm;Target=_top;status=");
aI("text=Success Stories;url=#MMpathNormal#/Main/.cfm;Target=_top;status=;");
aI("text=Press Room;url=#MMpathNormal#/Main/.cfm;Target=_top;status=;");
}

with(milonic=new menuname("Help")){
style=menuStyle;
aI("text=F.A.Q.;url=#MMpathNormal#/Main/.cfm;Target=_top;status=;itemwidth=106");
aI("text=Search Tips;url=#MMpathNormal#/Main/.cfm;Target=_top;status=");
aI("text=Match Tips;url=#MMpathNormal#/Main/.cfm;Target=_top;status=");
aI("text=Claim Tips;url=#MMpathNormal#/Main/.cfm;Target=_top;status=");
aI("text=Contact Us;url=#MMpathNormal#/Main/.cfm;Target=_top;status=");
aI("text=Privacy Policy;url=#MMpathNormal#/Main/.cfm;Target=_top;status=");
aI("text=Terms Of Service;url=#MMpathNormal#/Main/.cfm;Target=_top;status=");
}

with(milonic=new menuname("Profiles")){
style=menuStyle;
if ("#MMToken#" == "0000000000") {
aI("text=Log In / Join Free;url=#MMpathSecured#/Members/Login.cfm;Target=_top;status=Login to search using your saved profiles");
}
else {
aI("text=Log Out;url=#MMpathNormal#/Members/Logout.cfm;Target=_top;status=Log out to protect your saved profiles");
}
aI("text=Create / Maintain Profiles;url=#MMpathNormal#/Members/ProfileList.cfm;Target=_top;status=Create / Maintain Profiles");
aI("text=Search Using 'My Profiles';url=#MMpathNormal#/Members/.cfm;Target=_top;status=");
aI("text=Change Email Address;url=#MMpathSecured#/Members/.cfm;Target=_top;status=");
aI("text=Change Password;url=#MMpathSecured#/Members/.cfm;Target=_top;status=");
aI("text=Remove All Profiles;url=#MMpathSecured#/Members/.cfm;Target=_top;status=;itemwidth=150");
}

drawMenus();
</script>
</cfoutput>

Poster: kevin3442
Dated: Wednesday December 3 2003 - 0:59:25 GMT

Hi Dave,

I'm not sure which of the two oiginal questions you are still wondering about, so I'll try to address both.

(1) Menu widths. It seems like your submenus are currently the same width as the main menu items that trigger them. However, your use of the itemwidth property is a little different than the approach I might take. It looks like you've used it in one menu item definition per menu, but note that the definition for itemwidth as a menu item property says that:

Having said that however, I have noticed that it seems to work even in vertical menus. But when you use itemwidth in a menu item from a vertical menu, it seems to set the width for all of the items in the menu. If you were to specify an itemwidth for two or more menu items in a vertical menu, I believe the widest width would take precedence. You only use it in one item per menu, so that look like it's OK. In any case, you can also use itemwidth as a menu property, where it's effect is to set the width of all items in the menu to the specified number of pixels. I might prefer this approach for vertical menus. Note also that the definition of itemwidth when used as a menu property does not say that it should only be used in horizontal menus, so I'd feel better about using it this way in a vertical menu. In other words, instead of doing this:

You could do this:

Having said all that, I believe you could use the menuwidth property instead of itemwidth, since it seems that you are interested in directly setting the width of the menu rather than setting it indirectly using an itemwidth. In general, take the itemwidth from each of your main menu items that call submenus, then use them as the menuwidth settings in the corresponding submenu definitoins (as above). For example, the item definition for the "General" item in your Main Menu is:

So the definition for the "General" submenu should be:

I hope that made sense

(2) The Hand pointer. Regarding the pointer issue, I don't see anywhere in your code that you've tried to use the pointer menu item property. Using the above example, the "General" item in your main menu opens the General submenu, but doesn't have a url. So, if you don't want the hand pointer to show when mousing over the General item in the main menu, define that item like this:

or like this:

(3) Semicolons. One other comment. I notice that many of your menu item definitions do not have a semicolon after the last property setting, before the closing double-quote. I think there are a couple of threads in the forum where this has been identified as the cause of a problem. For example, the General item I've been referencing above is currently defined as:

There should be a semicolon after align=center, like this:

Hope some of that helps,

Kevin

It works !!!

Poster: DaveW
Dated: Wednesday December 3 2003 - 14:17:36 GMT

Kevin,
Thanks for the advice, it now works great. I actually added the itemwidth property back in for the submenus as the horizonatl separator ended at the length of the longest item rather than across the entire cell. After I added the itemwidth back in it fixed that. I also added ';' to the end of each line. I will post the latest code to the website later today.
Thanks for your help.
Dave.