Differentiating separator/border colours in main/sub menus

Taken From The Forum:
Forum Topic:
Last Updated: Saturday July 14 2012 - 06:07:24

Differentiating separator/border colours in main/sub menus

Poster: Bruce Dalbrack
Dated: Thursday November 24 2005 - 12:58:07 GMT

Hello

My menu is here: http://www.brucedalbrack.com I would like #FFFFFF separators/borders on the main menu but #888888 seperators/borders on the sub menus.

My apologies for the elementary nature of the question as I'm a bit thick looike viz HTML. Thanks in advance

Bruce

Poster: Ruth
Dated: Friday November 25 2005 - 0:25:48 GMT

Hi,

The easiest way is to make another style for the submenus. If the style is the same as the menuStyle except for separator colors then the best method is to use copyOf.

Code:

subStyle=new copyOf(menuStyle); 
subStyle.separatorcolor="#888888 "; 
subStyle.bordercolor="#888888"; 

Place that below the menuStyle after the closing } and before the

Code:

with(milonic=new menuname("Main Menu")){

For more information:

1. you need to put the calls for the menu files the first thing after the body tag before anything else

Code:

<body><SCRIPT language=JavaScript src="milonic_src.js" type=text/javascript></SCRIPT>    
<script   language=JavaScript> 
if(ns4)_d.write("<scr"+"ipt language=JavaScript src=mmenuns4.js><\/scr"+"ipt>");       
  else _d.write("<scr"+"ipt language=JavaScript src=mmenudom.js><\/scr"+"ipt>"); 
</script> 

<SCRIPT language=JavaScript src="menu_data.js" type=text/javascript></SCRIPT> 

2. you need to put the menu in the table using the correct method. You cannot just place the menu_data.js file there and have it work correctly on all browsers.

Table example

It's longer for me to try and write here how to do it, than if you take a look at the above link.

Ruth

Poster: shacker
Dated: Friday December 23 2005 - 1:46:13 GMT

Many thanks Ruth. This technique also comes in handy when you need a wide spacing on main horizontal menu, but don't want the vertical submenu items separated likewise.

Code:

subStyle=new copyOf(menuStyle);
subStyle.separatorsize="1";
subStyle.separatorpadding="1";

Poster: Ruth
Dated: Friday December 23 2005 - 1:51:52 GMT

Right, and there is also separatorwidth and separatorheight that can be used as long as you specify a separatorsize.

Ruth

Industrial Strength JavaScript and DHTML Menus

Differentiating separator/border colours in main/sub menus