cfmenu

Description

Creates a horizontal or vertical menu. Any menu item can be the top level of a submenu.

History

ColdFusion 8: Added this tag.

Syntax

<cfmenu 
    bgcolor="HTML color value" 
    childStyle="CSS style specification" 
    font="HTML font family" 
    fontColor="HTML color value" 
    fontSize="Number of pixels" 
    menuStyle="CSS style specification" 
    name="string" 
    selectedFontColor="HTML color value" 
    selectedItemColor="HTML color value" 
    type="horizontal|vertical 
    width="Number of pixels"> 
 
        cfmenuitem tags 
 
</cfmenu>

The cfmenu tag must have a body that contains at least one cfmenuitem tag to define the menu items and an end </cfmenu> tag. Note: You can specify this tag’s attribute in an attributeCollection attribute whose value is a structure. Specify the structure name in the attributeCollection attribute and use the tag’s attribute name as structure key.

Attributes

Attribute	Description	Required	Default
bgColor	The color of the menu background. You can use any valid HTML color specification. This specification has the following behaviors: You can override it locally by specifying the menuStyle attribute of this tag and any cfmenuitem tag. It controls the background of color surrounding a submenu whose background is specified by a childStyle attribute.	Optional	Background color style of the menu
childStyle	A CSS style specification that applies to the following menu items: The items of the top-level menu All child menu items, including the children of submenus This attribute lets you use a single style specification for all menu items.	Optional
font	The font to use for all child menu items. Use any valid HTML font-family style attribute. Some common values are serif, sans-serif, Times, Courier, and Arial.	Optional	Browser default font
fontColor	The color of the menu text. Use any valid HTML color specification.	Optional	black
fontSize	The size of the font. Use a numeric value, such as 8, to specify a pixel character size. Use a percentage value, such as 80%, to specify a size relative to the default font size. Font sizes larger than 20 pixels can result in submenu text exceeding the menu boundary.	Optional	Font size of the menu item
menuStyle	A CSS style specification that applies to the menu, including any parts of the menu that do not have items. If you do not specify style information in the cfmenuitem tags, this attribute controls the style of the top-level items.	Optional
name	The name of the menu.	Optional
selectedFontColor	The color of the text for the menu item that has the focus. Use any valid HTML color specification.	Optional	black
selectedItemColor	The color that highlights the menu item that has the focus. You can use any valid HTML color specification.	Optional	light blue
type	The orientation of the menu. The following values are valid: horizontal: Menu items are arranged horizontally. vertical: Menu items are arranged vertically. Submenus of both menu types are always arranged vertically.	Optional	horizontal
width	The width of a vertical menu; not valid for horizontal menus. Use a numeric value, such as 50, to specify a pixel size. Use a percentage value, such as 30%, to specify a size relative to the parent element’s size.	Optional	Width of the container

Usage

The cfmenu tag defines a horizontal or vertical ColdFusion menu. You use a single cfmenu tag to define the general menu characteristics, and you use cfmenuitem child tags to define the individual menu entries and any submenus. You create submenus by putting cfmenuitem tags in the body of a cfmenuitem tag.
You cannot nest a cfmenu tag inside a form or inside a cfmenu tag or cfmenuitem tag.

Example

The following example creates a simple menu bar. When you click an entry in the bar, the browser displays the Adobe website page for the selected product. You can expand the ColdFusion item by clicking the icon, and then select an item to display a specific ColdFusion web page.

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
</head> 
<body> 
<cfmenu name="menu" type="horizontal" fontsize="14" bgcolor="##CCFFFF"> 
    <cfmenuitem name="acrobat" href="http://www.adobe.com/acrobat" display="Acrobat"/> 
    <cfmenuitem name="aftereffects" href="http://www.adobe.com/aftereffects"  
        display="After Effects"/> 
    <!--- The ColdFusion menu item has a pop-up menu. ---> 
    <cfmenuitem name="coldfusion" 
            href="http://www.adobe.com/products/coldfusion" display="ColdFusion"> 
        <cfmenuitem name="buy" 
            href="http://www.adobe.com/products/coldfusion/buy/" display="Buy"/> 
        <cfmenuitem name="devcenter" 
            href="http://www.adobe.com/devnet/coldfusion/" display="Developer Center"/> 
        <cfmenuitem name="documentation" 
            href="http://www.adobe.com/support/documentation/en/coldfusion/" 
                display="Documentation"/> 
        <cfmenuitem name="support" href="http://www.adobe.com/support/coldfusion/"  
            display="Support"/> 
    </cfmenuitem> 
    <cfmenuitem name="flex" href="http://www.adobe.com/flex" display="Flex"/> 
</cfmenu> 
</body> 
</html>

cfmldocs