Adobe ColdFusion 8

cfmenuitem

Description

Defines an entry in a menu, including an item that is the head of a submenu.

Category

Display management tags

Syntax

<cfmenuitem
    display="string"
    childStyle="CSS style specification"
    href="URL or JavaScript function"
    image="path"
    menuStyle="CSS style specification"
    name="string"
    style="CSS style specification"
    target="location identifier">
        Optional child menuitem tags
</cfmenuitem>

OR

<cfmenuitem
    divider[="true"]/>

If the cfmenuitem tag does not have a body with an end </cfmenuitem> tag, you must close the tag with a forward slash character before the closing greater than character (/>), for example, <cfmenuitem divider="true"/>.

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.

See also

cfmenu, "Using menus and toolbars" in "Using Ajax UI Components and Features" in the ColdFusion Developer's Guide

History

ColdFusion 8: Added this tag.

Attributes

Attribute

Req/Opt

Default

Description

display

Required if divider attribute is not specified

 

The text to show as the menu item label.

childStyle

Optional

Style determined by parent

A CSS style specification that applies to all child menu items, including the children of submenus.

divider

Optional

 

This attribute specifies that the item is a divider. If you specify this attribute, you cannot specify any other attributes. You can use this attribute without a value, as in the following example:

<cfmenuitem divider />.

You cannot use this attribute in a top-level horizontal menu.

href

Optional

 

A URL link to activate or JavaScript function to call when the user clicks the menu item.

image

Optional

 

URL of an image to display at the left side of the menu item. The file type can be any format that the browser can display.

For most displays, you should use 15x15 pixel images, because larger images conflict with the menu item text.

menuStyle

Optional

Style determined by parent

A CSS style specification that controls the overall style of any submenu of this menu item. This attribute controls the submenu of the current menu item, but not any child submenus of the submenu.

style

Optional

Style determined by parent

A CSS style specification that applies to the current menu item only. It is not overridden by the childStyle attribute.

name

Optional

 

The name of the menu item.

target

Optional

The current window and frame (if any)

The target in which to display the contents returned by the href attribute. The attribute can be a browser window or frame name, or an HTML target value, such as _self.

Usage

Every cfmenuitem tag must be a child of a cfmenu tag or a cfmenuitem tag. To create a submenu, put the cfmenuitem tags for submenu items in the body of the cfmenuitem tag for the submenu root in the parent menu. For an example of a simple submenu, see cfmenu.

Example

The following menu shows the effects of the various style attributes on the menu and menu item appearance.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<cfmenu name="menu" type="horizontal" fontsize="14" bgcolor="##FF9999"
    childStyle="font-weight:bold; font-size:12px; border:medium; background-color:##99FF99"
    menuStyle="font-weight:bold; font-style:italic; font-size:14px;
    background-color:##9999FF">
    <cfmenuitem name="acrobatInfo" 
        href="http://www.adobe.com/acrobat" display="Acrobat"/>
    <cfmenuitem name="aftereffectsInfo"
        href="http://www.adobe.com/aftereffects" display="After Effects"/>
    <!--- The ColdFusion menu item has a pop-up menu. --->
    <cfmenuitem name="cfInfo" 
        childStyle="font-weight:bold; font-size:12px; border:medium;
        background-color:##FF0000" style="font-weight:bold; 
        font-style:italic; font-size:16px; border:medium; background color:##00FF00"
        menuStyle="font-weight:bold; font-style:italic; font-size:16px; 
        border:medium; background-color:##0000FF"
        href="http://www.adobe.com/products/coldfusion" display="ColdFusion">
    <cfmenuitem name="cfbuy" 
        href="http://www.adobe.com/products/coldfusion/buy/" display="Buy"/>
        <cfmenuitem divider="true"/>
        <cfmenuitem name="cfdevcenter"
            href="http://www.adobe.com/devnet/coldfusion/" display="Developer Center"/>
        <cfmenuitem name="cfdocumentation"
            href="http://www.adobe.com/support/documentation/en/coldfusion/"
            display="Documentation">
            <cfmenuitem name="cfmanuals"
                href="http://www.adobe.com/support/documentation/en/coldfusion/
                index.html##manuals" display="Product Manuals"/>
            <cfmenuitem name="cfrelnotes"
                href="http://www.adobe.com/support/documentation/en/coldfusion/
                releasenotes.html" display="Release Notes"/>
        </cfmenuitem>
        <cfmenuitem name="cfsupport"
                href="http://www.adobe.com/support/coldfusion/" display="Support"/>
    </cfmenuitem>
    <cfmenuitem name="flexInfo" href="http://www.adobe.com/flex" display="Flex">
        <cfmenuitem name="fldocumentation"
            href="http://www.adobe.com/support/documentation/en/flex/"
            display="Documentation" >
            <cfmenuitem name="flmanuals"
                href="http://www.adobe.com/support/documentation/en/flex/
                index.html##manuals" display="Product Manuals" />
        </cfmenuitem>
    </cfmenuitem>
</cfmenu>
</body>
</html>