|
home / samples / popup menus
Popup Menus
Popup menus, as their name implies, are tied directly to links in a page. They
"Popup" when the link is rolled over, or, optionally, clicked. By default, popup
menus appear at the mouse's location when they are called for. You can adjust
this positioning in multiple ways; visit our Menu Positioning Mini-Tutorial
for further information.
Here are a few links all of which display popup menus with default positioning.
Each of these menus displays on rollover:
Main Menu
Menu Samples
Documentation
You may or may not have noticed in the examples above that the "Samples" and
"Documentation" menus are used twice; once as child menus of the main menu, and
then again as popup menus for the individual links. We did not have to duplicate
these two menus to accomplish this effect; we simply called the child menus
directly in our second two popup links.
Here are some example menus that will popup when you click the link. Notice
also that the second menu makes use of relative positioning; it is placed at the
same spot in the page (a position 20px to the right and 4px down from the position
of the link itself, to be precise). The other two menus continue to use default
positioning.
Main Menu
Menu Samples
Documentation
The lower main, documentation, and sample menus did have to
be duplicated, however; HierMenus provides no way for you to have the same
menu appear on a page as both a ClickStart
menu and a rollover menu.
Finally, note that there is one further example of popup menus on this page: namely,
our main navigation menus on the upper left side of the page. Each of these is configured
to popup when the main link is rolled over. We recommend this popup approach instead of
permanent menus whenever possible, as the in-page links will always be displayed to the
user (and can therefore be followed by them) even if they are using an older browser that
HierMenus does not support or if they intentionally have JavaScript disabled.
Click the link below to have a look at the configuration file we used to generate
these sample menus:
popups.js
|
