ColdFusion 9.0 Resources

cfmenu

Description

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

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.

History

ColdFusion 8: Added this tag.

Attributes

Attribute	Req/Opt	Default	Description
`bgColor`	Optional	Background color style of the menu	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.
`childStyle`	Optional		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.
`font`	Optional	Browser default 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`.
`fontColor`	Optional	`black`	The color of the menu text. Use any valid HTML color specification.
`fontSize`	Optional	Font size of the menu item	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.
`menuStyle`	Optional		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.
`name`	Optional		The name of the menu.
`selectedFontColor`	Optional	`black`	The color of the text for the menu item that has the focus. Use any valid HTML color specification.
`selectedItemColor`	Optional	`light blue`	The color that highlights the menu item that has the focus. You can use any valid HTML color specification.
`type`	Optional	`horizontal`	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.
`width`	Optional	Width of the container	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.

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>