adrianTNT.com - Flat Menu XML
Flat menu is a drop down flash menu with sub menus, the menu can be configured by editing a configuration file (menu.xml) with a text editor. You can change buttons colors, button text, links, target frame, etc.
Most users only need the menu to open the site links but for advanced users this menu can also trigger other actions in addition to opening html pages, the menu can also call functions inside flash file, do loadMovie, go to another frame, trigger FScommands and more.
Menu preview 1, with bevel activated, menu_width = "511"
This drop down flash menu has something different than what we did before; this menu resizes it's own div in html code so that it doesn't overlap other html items like html links, normally if the menu is only made transparent and you can see the content behind it you cannot click html links in some browsers like Mozilla, but this menu resizes its own div when menus are collapsed so that it only uses around 22px of vertical space without affecting the html content under it (like this text).
Menu preview 2, without bevel, menu_width = "590" showing blank bar on right side
As you can see the second menu has a more "flat" look and it doesn't have 1px bevel on main buttons like the first menu, you can change this by show_bevel = "true" or "false".
This menu can also be used without flash program, it is a standalone file that can be configured with a text editor, you will get the exact html code to place the swf file in your html page, then edit the configuration file to change colors, links, menu speed, etc. These options look like this: menu_width="760" main_button_height="22" main_text_color="FF9900".
Source file is included in case you want to do advanced modifications, source file is compatible with Flash MX 2004 and later.
Sample xml file form menu configuration:
<menu text="Services" what="http://www.adriantnt.com" where="_parent" type="geturl">
Some more advanced options for this drop down menu:
You might not understand all these commands but if you do not know what they do just leave them as they are by default.
By default the menu is set to open html links.
|type||action type when a button is clicked. Default is set to "getURL", meaning the button will open a link, other values can be loadMovie, function, gotoAndStop, gotoAndPlay, FScommand.|
|what||this parameter shows what URL to open, what frame to go to, what movie to load or what FS command to trigger, depending on the action type set above|
|where||this parameter is the target frame of the url to open or the clip where to load a movie or where to play frames, depending on the action type.|
|menu_width||width of the menu bar|
|main_text_color||text color of main button|
|main_rollover_text_color||text color of main button when mouse is on button|
|sub_text_color||text color for sub menus|
|sub_rollover_text_color||text color of sub button when mouse is on button|
||this is drop down menu speed, how many pixels to move at once|
||how many milliseconds to wait before closing the sub menu after mouse is no longer on button|
||left-right space of main button text|
|left-right space of sub button text|
|height of main button, in pixels|
|sub_button_height||height of sub buttons, in pixels|
|main_button_color||color of main button, enter it without #, for example: "FFCC00" is yellow|
|main_button_border_color||color of main button border, when bevel is enabled this border is no longer visible and the bevel colors will be visible|
|sub_button_color||color of sub button|
|sub_button_border_color||borders around sub buttons|
|main_rollover_gradient_a||a gradient is made of two colors, a and b are the start and the end colors of button when mouse is over the button. If you want a flat rollover color then make a and b the same.|
|show_bevel||if set to "true" then a 1px bevel will be visible on main buttons, like on the first menu above.|
|bevel_light_color||the color of the top and left area of the bevel, light area.|
|bevel_dark_color||the bevel color on right and bottom side of the menu|
|the html id of the div to be resized, in the code you receive this is set to "flat_menu", the name of the div in html code.|