An Image Button is a button capable of displaying both an image (gif, jpeg, etc) and descriptive text within the boundary of the button. Clicking anywhere within the boundary of the object triggers an action (normally a JavaScript onClick handler). The button can be enabled or disabled, and have a different appearance when the mouse is inside its border.

A Menu Button extends an Image Button to allow for a menu or tree to popdown from the button when the mouse is down for a certain amount of time (referred to as "click and hold"). An example of a Menu Button in 4.X is the "Back" button which pops down a menu containing the window history on a click-and-hold. Mozilla extends this notion with the ability to pop down a live tree view.

Requirements

For Image Buttons:

Manipulation of images and properties through the DOM and CSS
Must support the following JavaScript event handlers
- onClick
- onMouseOver
- onBlur
- onChange
- onFocus

Must support 4 images and states

normal

rollover

depressed

disabled

Must support multiple alignment

text right image left

text left image right

Text bottom image top

Text top image top

If the button is compressed smaller than it can accommodate, it needs to be able to truncate its text.

Right truncation	text right i...
Left truncation	....t image right
Center truncation	text ... left

For Menu Buttons

Everything an Image Button could do, plus the following:

show a popdown menu, either on a click or a click-and-hold
show a popdown tree, either on a click or a click-and-hold
For the tree, users need to be able to expand or collapse folders within the tree without it going away. The tree goes away only when the user clicks outside of the presented tree or on an element that has no children (a "leaf").
Children which populate the popdown menu or popdown tree are specified as children of the Menu Button in the DOM.