Style properties can be declared in a global style, menu or menu item using the standard menu property pairs variablename="value"; declaration.

All style parameters must be entered after the with(stylename=new mm_style()){ declaration (note that you must replace the text stylename with the name of your style). Property definitions are in the 2 pair structure: propertyname="propertyvalue"; For the full list of properties that can be used within a style definition, please visit Menu Style Properties Quick Reference

If a property is not needed it can be removed from the data file completely; there is very little point declaring a variable if the default value is all that is required. This allows you to construct a menu data file using the minimum of bytes needed, assisting in a quicker download of the menu. It also helps make the data file easier to understand as it isn't full of redundant parameters.

Note that the structure of the menu data file is as close to being Object Oriented as JavaScript will allow. JavaScript itself is not an Object Oriented language but is an Object Based language.

So, from this sample you can see that each menu can have its own style if this is your requirement. Normally though, only one style is needed but there are instances where you may want the top level (horizontal) menu to have a different setup than your sub (vertical) menus. This can be achieved by declaring more than one style as you can see by the code below.

Creating different styles is useful for changing many of the properties of a style completely, but what if you only wanted to change, say one or two parameters. The most efficient way of doing this is by creating a new style based on values from another style. The copyOf() function is the tool for this job. Here is an example:

with(verticalStyle=new mm_style()){
onbgcolor = "#ECF4F9";
oncolor = "black";
offbgcolor = "#eeeeee";
offcolor = "#000000";
bordercolor = "#000000";
borderstyle = "solid";
separatorcolor = "black";
separatorsize = 1;
separatorpadding = 1;
padding = 3;
borderwidth = 1;
onborder = "1px solid black"
fontsize = "75%";
fontstyle = "normal";
fontfamily = "arial, verdana, tahoma";
pagecolor = "#bbbbbb";
pagebgcolor = "#3366cc";
subimage = "/images/arrow.gif";
}

horizontalStyle=new copyOf(vertStyle)
horizontalStyle.subimage = "/images/arrow_down.gif";

The above sample code, creates a global style that will be used for all vertical submenus called, verticalStyle. If you wanted to use the same style for your horizontal menu but you needed the submenu indicator image changing, you could create a copy of the verticalStyle with the copyOf() function giving your new style a name of horizontalStyle.

horizontalStyle is now an exact copy of verticalStyle and all you need to do now is change the property or properties that you require for your newly created style.