Example: (click the 'menu maker' link to change appearance, content and size of the example)
What can this menu do for you?
» This is a slip-down java menu applet suitable for use as a navigation bar across the top of your page.
» Submenus. The menus have one level of sliding submenus. Move your mouse over any menu item to try out the effect. A small submenu will slide elegantly down from the menubar.
Here is the extra information you requested about sliding submenus.
» Important information. The submenus on this menu can only display within the area assigned to the menu. They cannot slip or drop outside the menu display area. If you need the submenus to display outside the menu area, we have other menus which can do this. If the menus stay within the menu area, it is possible to programme the elegant submenu styles and animations which you see here.
- One level of sliding submenus is available
- To open a submenu, simply move the mouse over an entry marked with an arrow.
- To close a submenu, either click the mouse on its parent item, or move the mouse over a different parent item.
- The menu is 'tidy', which means that only one submenu is ever open at a time. This means that the menu doesn't take up too much space on your page, and the user can always easily see where they are in the menu.
- Note that the submenu does not close when the mouse is moved or clicked outside the menu area. This is intentional - most people prefer to see where they are.
» Aqua-R theme. The Aqua-R design is a different approach to the watery 3D buttons which have become popular on many well-designed sites. The buttons are much darker than the other aqua themes and only the hue can be modified by the user. Different menu types are categorised into themes, so you can obtain a variety of matching menus. Click here to see all the menus which match this theme.
» States and colours. The menu items each have three states combining to distinguish rollover items and submenu items.
Here is the extra information you requested about states and colours.
» Fonts and text formatting. The menu supports true-type fonts and you can format text colour, size, weight and alignment.
- Top-level items have three states: (i) normal, (ii) rollover OR open, and (iii) rollover AND open.
- When the mouse rolls over a top-level item with a submenu, the submenu opens and both the parent item and its children (submenu) use the rollover colour as the standard colour and the third defined colour is used as the rollover colour for the opened submenu.
- For menus with gradients and graphical effects, the applet interprets a simple colour request by the user and generates all the extra colours necessary.
- Click here for information about how to configure colours manually.
- Click the 'menu maker' link with the magic wand at the top of the page to reveal an online configurator to experiment with menu colours live.
Here is the extra information you requested about fonts and text formatting.
» Layout and line-wrapping. This menu features automated layout. Automated layout means that the menu adapts itself to the content you enter into it. For example, buttons and menu items will be automatically sized and the thematic elements recalculated to fit precisely.
- True-type fonts. Any kind of font which you can display in HTML will also display in the applet (except in very old browsers).
- The demonstration above randomly switches between Verdana and Comic Sans, but you can reconfigure the demonstration live to experiment with your own fonts.
- Colour states. You can define colours for up to three text states, which are normally standard, rollover and active/pressed. So, for example, the text can change colour when the mouse moves onto it, or when the mouse button is clicked. The function of the third colour set may vary with some menu types.
- Alignment. You can align the text left, right or centre.
- Text size and weight. You can give the text almost any size. 'Weight' means you make it 'bold' or 'not bold'.
- Click the 'menu maker' link with the magic wand at the top of the page to reveal an online configurator to experiment with fonts and text live.
Here is the extra information you requested about layout and line-wrapping.
» Icons. Icons are supported. Icons are multi-state and easily redefined by the user.
- This menu supports line-wrapping on submenus only. If your text is too long to fit onto one line, it will be wrapped, and the button or menu item height will be automatically increased to make extra space.
- You can also force line-breaks in submenus instead of relying on automatic wrapping. Click here to find out how to insert line-breaks.
- The layout of this menu has some restrictions due to its general purpose and design. The menubar across the top of the menu is always exactly 24 pixels high, and this cannot be changed. However by increasing the overall menu height, you can increase the space into which the submenus can slip down. Typically a height of 80 pixels will allow about 4 items per submenu, or 100 pixels allows about 6 items per submenu.
- The width of menu items is generally determined by the parent item. If a submenu item is wider than its parent, then the menu will automatically wrap the lines. However to ensure enough space for submenu items when the parent item is very narrow, there are varying minimum widths for submenus.
- The menu displays best if the menubar text is left at the default size of 11.
- The submenu text is always one point smaller than the menubar text, and the submenu items are placed relatively close together. This keeps the submenus compact so that you don't need to make the menu too high to display them all.
- To adjust the text position left or right, or to assign more vertical space to a menu item, you can use transparent GIF icons. A transparent icon doesn't show, but it pushes the text and the menu item borders. You can also enlarge an existing icon with transparent space to achieve the same effect.
Here is the extra information you requested about icons.
» Hyperlinks. Every menu item can have hyperlinks attached.
- Icons are optional - you don't have to have them.
- Icons are just simple GIF or JPG files and you can use any image files that you find around the web, or you can make your own. As they are GIF/JPG files, you can edit your icons with any image editor.
- You can choose different icons for each menu item.
- You can define one, two or three states for your icons.
- A two-state icon has one state for its normal appearance, and another state for when the mouse moves over it.
- A three-state icon has an additional state which is normally used as an active/pressed-in indicator. However the purpose or availability of this third state may vary with some menu types.
- Click here to find out how to tell the applet which icons it should display.
Here is the extra information you requested about hyperlinks.
- Hyperlinks can be relative or absolute, so you can link both to your site and to other sites.
- If you are using frames, you can target hyperlinks to any frame of your choice.
- You can attach any number of hyperlinks to a menu item, so if you are using a complex set of frames, you can change any or all of the frames.
- Just like HTML hyperlinks, the menu understands special frame targets like '_top', '_blank', etc.
- 'mailto://' hyperlinks work.
- Click here to find out how to attach hyperlinks to your menu items.
Here is the extra information you requested about scripts.
» Separators. Insert specially styled separators wherever you like. Separator appearance is dependent on the menu theme and some have dramatic visual effects to enhance the menu interface. is a larger-than-normal space between buttons. Slip-down menus have the normal thematic separators along the menubar. Submenus may or may not display separators, depending on the menu style. If they do have separators, these submenu separators are two-colour lines. Click here to find out how to insert separators into your menu.
- Click here to find out how to attach scripts to your menu items.
» Capacity. This menu supports up to 50 menu items, including submenu items (if available). For greater capacity, or for menus created dynamically or from databases, try the Big Happy Menus variation.
» Tools. An online visual configuration tool is available. Just click menu maker. It can be used to edit the size, appearance and content of your menu.
» Sound effects. The menu can trigger sounds of your choice.
» For navigation menus similar to this but with more features and higher capacity, try these menus from imint.com or these drop-down menus from alienmenus.com.
» Custom solutions based on this menu are also available.
» Help. Here is a help page with more information. If you would like to open up ALL the hidden extra information sections on this page simultaneously, then click here.
More Happy Slip-down Menus
More Happy Aqua-R Menus