Header Style Menu in Monzilla and Opera

[jaf]

I am using a Header Style Menu to seperate different menu categories. I am not using a Header Title between menus but rather just a thin horizontal line. This works fine in IE but other browsers such as Monzilla and Opera display a much thicker line. Is there a way to fix this?

Jeff

[Hergio]

URL please....thanks. You got us blindfolded without being able to see the problem and find its root.

[jaf]

It's on an Intranet so I can't provide a URL. I included the menu coding. Hopefully this helps.



_menuCloseDelay=500 // The time delay for menus to remain visible on mouse out
_menuOpenDelay=150 // The time delay before menus open on mouse over
_followSpeed=5 // Follow scrolling speed
_followRate=50 // Follow scrolling Rate
_subOffsetTop=0 // Sub menu top offset
_subOffsetLeft=-10 // Sub menu left offset
_scrollAmount=3 // Only needed for Netscape 4.x
_scrollDelay=20 // Only needed for Netcsape 4.x



with(HeadersStyle=new mm_style()){
onbgcolor="#ffffff";
oncolor="#c0c0c0";
offbgcolor="#ffffff";
offcolor="#000000";
bordercolor="#000080";
borderstyle="solid";
borderwidth=0;
padding=5;
fontsize="11";
fontstyle="normal";
fontweight="normal";
fontfamily="verdana,helvetica";
headercolor="#000000";
headerbgcolor="#000000";
separatorwidth="2";
pagecolor="0033cc";
pageimage="../images/arrow.gif";
}


with(milonic=new menuname("Main Menu")){
style=HeadersStyle;
top=100;
left=2;
alwaysvisible=1;
aI("text=Home                                ;url=http://atnds.us.nds.com/cs/;image=../images/arrow.gif;");
aI("text=;separatorcolor=black;separatorsize=0;type=header;align=center;");
aI("text=Email File Filters;url=FileFilters.htm;image=../images/arrow.gif;");
aI("text=Firewall Ports;url=FirewallPorts.htm;image=../images/arrow.gif;");
aI("text=Security Policies;url=SecurityPolicies.htm;image=../images/arrow.gif;");
aI("text=Windows Password;url=WindowsPassword.htm;image=../images/arrow.gif;");
aI("text=Wireless Networking;url=WirelessNetworking.htm;image=../images/arrow.gif;");
aI("text=;separatorcolor=black;separatorsize=0;type=header;align=center;");
}








drawMenus();

[Hergio]

This is not the way to do it...you are using an entire blank menu item to try and separate things, try these two ways.
First, you could use the type = header ability of a menu item...this allows you to make a menu item a separator between to sections of the menu, but not make it clickable. Your doing this but since you dont want text in there, so the next option.
Put the separator in the home item (separatorsize=1), thats what the separator is for. It will make HOME have a thin line either under it, or next to it depending on your orientation. See itemproperties.php to see the attribute. So in you case, its vertical so it would put a line under home, thus separating home and the rest of the items.

[jaf]

Thank you for your help. I got the working now.

The only issue I have is that I can't seem to get the seperator line to appear unless there is text below it. See the last line of code. Visually this is not a problem but if you mouse over the area there appears to be a hyperlink with nothing defined.

Regards,

Jeff


_


_menuCloseDelay=500 // The time delay for menus to remain visible on mouse out
_menuOpenDelay=150 // The time delay before menus open on mouse over
_followSpeed=5 // Follow scrolling speed
_followRate=50 // Follow scrolling Rate
_subOffsetTop=0 // Sub menu top offset
_subOffsetLeft=-10 // Sub menu left offset
_scrollAmount=3 // Only needed for Netscape 4.x
_scrollDelay=20 // Only needed for Netcsape 4.x



with(HeadersStyle=new mm_style()){
onbgcolor="#ffffff";
oncolor="#c0c0c0";
offbgcolor="#ffffff";
offcolor="#000000";
bordercolor="#000080";
borderstyle="solid";
borderwidth=0;
padding=5;
fontsize="11";
fontstyle="normal";
fontweight="normal";
fontfamily="verdana,helvetica";
headercolor="#000000";
headerbgcolor="#000000";
separatorheight="1";
separatorwidth=176;
pagecolor="0033cc";
pageimage="../images/arrow.gif";
}


with(milonic=new menuname("Main Menu")){
style=HeadersStyle;
top=100;
left=2;
alwaysvisible=1;
aI("text=Home;separatorcolor=black;separatorsize=1;url=http://atnds.us.nds.com/cs/;image=../images/arrow.gif;");
aI("text=Request Support;url=RequestSupport.htm;image=../images/arrow.gif;");
aI("text=After Hours Support;url=AfterHoursSupport.htm;image=../images/arrow.gif;");
aI("text=International Support;separatorcolor=black;separatorsize=1;url=InternationalSupport.htm;image=../images/arrow.gif;");
aI("text= ");
}

[Hergio]

Get rid of that last menu item (the blank one), it doesnt need to be there. And if you really want a line under the last item, define a CSS style class that has border-bottom set to 1px black solid...

Code: Select all

.finalItem{
   border-bottom:1px black solid;
}

And then in your menu item set the onClass and offClass to finalItem so that it draws a line along the bottom of that item.

Code: Select all

aI("text=International Support;separatorcolor=black;onclass=finalItem;offclass=finalItem;url=InternationalSupport.htm;image=../images/arrow.gif;");

G' Luck!