The description of the properties will soon be completed. The following style properties may be placed:
with(MyMenuStyle=new fxmenustyle()){
here
} |
Please note: The syntax for style properties and menu properties slightly differs from the syntax for item properties (the quotes!).
|
| Property | Description | Example |
| visible | "Visible" has to be declared as true for the main menu to keep it permanently visible. | visible=true; |
| position | Declare as "absolute", "relative" or "tooltip". Submenus have by default the value relative for "position".
To find out, how to position your main menu relative to a table cell, please take a look at the relative positioning menu sample. | position="absolute";
position="relative";
position="tooltip"; |
| left | Horizontal offset for submenus or the position from left for absolute positioned main menus. Auto-unit is pixel. | left=120; |
| top | Vertical offset for submenus or the position from top for absolute positioned main menus. Auto-unit is pixel. | top=90; |
| orientation | "Orientation" can be declared for main menus and/or submenus as well. | orientation="vertical";
orientation="horizontal";
|
| showdelay | Time delay before submenus are displayed, when you move your mouse over an item with a submenu. Unit is milliseconds (1000 = 1 second). Default value is 0. | showdelay=1000; |
| showonclick | By default a submenu appears when you move your mouse over the parent item. Change this behaviour by declaring "showonclick" as true. | showonclick=true; |
| hideonclick | With "hideonclick" declared as true, a visible submenu can be closed by clicking on the parent item. | hideonclick=true; |
| keeponblur | "Keeponblur", "keepvisible" and "keeponclick" can be used to change the standard behaviour of FX Menu. (Nearly) complete description: Menu Behaviour - Event Handler Guidelines. | |
| keepvisible | |
| keeponclick | |
| direction | Submenus usually drop down or drop down right, when the parent menu is vertical. Being not limited to this submenu display option, offers many new positioning options. | direction="up";
direction="up;right";
direction="down,right";
direction="down";
direction="down;left";
direction="up;left";
direction="left";
|
| alignwith | Usually a submenu is positioned relative to the parent item, but with setting "alignwith" to "menu" a position relative to the parent menu is possible too. In combination with "direction", "left" and "top" there are several ways to position a submenu relative to the main menu. | alignwith="menu" |
| width | Item's width in pixel. | width=150; |
| height | Item's height in pixel. | height=150; |
| filterover | Use any Internet Explorer filter or transition. You can find more information about Microsoft filters & transitions at: http://msdn.microsoft.com/. "Filterover" and "filterout" are only visible in Internet Explorer 5.5+.
If you are a newbie to filters, try the following shadow filter: filterover="Alpha(opacity=80)"; | filterover="Shadow(color='#0000FF', Direction=135, Strength=3);Fade(duration=0.3);Alpha(opacity=90)" |
| filterout | Apply and play filters and transitions in Internet Explorer, when the menu gets hidden. | filterout="Randomdissolve(duration=0.3)" |
| functionover | "Functionover" works like an interface between the FX Menu and your own functions ("mouseover"). Executed, each time, when you move your mouse over a menu. | functionover="myfunction()" |
| functionout | "Functionout" works like an interface between the FX Menu and your own functions. Executed, each time, when you leave a menu ("mouseout")). (Leaving a menu, doesn't necessarily mean, that the menu is now hidden or gets hidden.) | functionout="myfunction()" |
| screenalign | Positions your menu relative to the visible part of the browserwindow. "Screenalign" is in the hierarchy above left and top, but is only valid for the main menu. | screenalign="right";
|
| overlap | Declare "overlap" as true, when you want to overlap styled elements, select boxes, form elements, flash, iframes, ... in modern browsers. Unfortunately this doesn't guarantee in all browsers, that FX Menu is displayed above those elements. | |
| highlightpath | Shows the current path in the menu, by keeping the "mouseover" or "mousedown" state for items with visible submenus. | highlightpath=true; |
| menuwidth | This property is used to set a certain width in pixel or percentage for the main menu.
Don't use "scroll=auto" in the body tag or in CSS for body, because the menuwidth in Internet Explorer might be wrong by the scrollbar-width, when the page has vertical scrollbars and menuwidth is set in "%".
| menuwidth="99%";
menuwidth="780px";
|
| menuheight | Deprecated, except someone convinces me that he needs and/or likes it. This property is used to set a certain height in pixel or percentage for the main menu. | menuheight="55%";
menuheight="380px";
|
| menualign | Only works, when a certain "menuwidth" or "menuheight" for an absolute positioned main menu is declared and should be used to change the position of the items within the menu. For example declare: menuwidth="95%" and menualign="center" to stretch your menu to 95% of the screenwidth and to keep your items centered. | menualign="right";
menualign="center";
menualign="middle";
menualign="bottom";
menualign="right;middle";
menualign="right;bottom";
menualign="center;bottom";
menualign="center;middle"; etc. |
| wiseposition | Intelligent repositioning keeps track of your visitors screen resolution. Menus will always be kept inside the window's boundaries. | wiseposition=true; |
| shadowstrength | Useful in combination with wiseposition=true and a shadow in filterover. When submenus, that normally would display outside the visible screen, are repositioned to keep them inside the window's boundaries, the new position in Internet Explorer is wrong by the strength defined for shadow. This can be corrected with "shadowstrength". If you think this is too complicated, please forget this property, it's not that important. | shadowstrength=5; |
| colorvisited | Works the same way like CSS a:visited{}. HEX values or valid HTML colornames can be used for "colorvisited". This is a very interesting feature in FX Menu, but has some quirks: Several font-properties are inherited by the general CSS settings for the a tag. This especially causes quirks with "decoration" and "decorationon".
"Colorvisited" is false for items using "texton", because of internal menu structure. | colorvisited=#FF00FF; |
| fontstylevisited | Additional CSS property for visited URLs. Valid value is italic. This is a very interesting feature in FX Menu, but has some quirks: Several font-properties are inherited by the general CSS settings for the a tag. This especially causes quirks with "decoration" and "decorationon".
"Colorvisited" is false for items using "texton", because of internal menu structure. | fontstylevisited=italic; |
| columns | | |
| separatorsize | | |
| separatorcolor | HEX values or valid HTML colornames can be used here. | |
| menubgcolor | HEX values or valid HTML colornames can be used here. | menubgcolor="#0000FF"; |
| menubgimage | | menubgimage="rainbow.gif" |
| menumargin | | menumargin=2 |
| menuborderwidth | | menuborderwidth=1 |
| menuborderstyle | All valid CSS 1 and CSS 2 values can be set for "borderstyle". | menuborderstyle="outset"; |
| menubordercolor | HEX values or valid HTML colornames can be used here. | menubordercolor="#000000"; |
| overflow | When overflow is set to "scroll", vertical scrollbars will be added in modern browsers, if necessary. | overflow="scroll" |
| flickthrough | | |
| hidelayer | | |
