Warning:
This wiki has been archived and is now read-only.
Elements/menu
From HTML Wiki
< Elements
Contents
The <menu> element represents a list of commands.
HTML Attributes
type
= context/ toolbar/ list
Indicates the kind of menu being declared:- context
the commands of a context menu, and the user can only interact with the commands if that context menu is activated. [Example B] - toolbar
A list of active commands that the user can immediately interact with. [Example A] - list
an unordered list of items (each represented by an li element), each of which represents a command that the user can perform or activate, or, if the element has no li element children, flow content describing available commands.
- context
label
= string
Gives the label of the menu.
See also global attributes.
Examples
Example A
For example, the following represents a toolbar with three menu buttons on it, each of which has a dropdown menu with a series of options [try it]:
<menu type="toolbar"> <li> <menu label="File"> <button type="button" onclick="fnew()">New...</button> <button type="button" onclick="fopen()">Open...</button> <button type="button" onclick="fsave()">Save</button> <button type="button" onclick="fsaveas()">Save as...</button> </menu> </li> <li> <menu label="Edit"> <button type="button" onclick="ecopy()">Copy</button> <button type="button" onclick="ecut()">Cut</button> <button type="button" onclick="epaste()">Paste</button> </menu> </li> <li> <menu label="Help"> <li><a href="help.html">Help</a></li> <li><a href="about.html">About</a></li> </menu> </li> </menu>
Example B
Here is an example of a context menu for an input control [try it]:
<form name="npc"> <label>Character name: <input name=char type=text contextmenu=namemenu required></label> <menu type=context id=namemenu> <command label="Pick random name" onclick="document.forms.npc.elements.char.value = getRandomName()"> <command label="Prefill other fields based on name" onclick="prefillFields(document.forms.npc.elements.char.value)"> </menu> </form>
HTML Reference
The HTML5 specification defines the <menu> element in 4.12.4 The menu element.