DynarchMenu: positioning test

As you can see by looking in the sources of this page, our menu gets positioned where the toplevel <ul> element is. In this page we included it in the second row of a table and aligned it in such a way that it will stay at the bottom of the page, assuming the page does fit in the browser view.

In other words: why learning “yet another positioning technique”? You can rely on any technique that you know so far; you position the menu just like you position any HTML element in page—use TABLE, DIV-s, CSS, position absolute or fixed, whatever. The menu does not have to care about this—it gets generated in place of the UL element.

This page also demonstrates the fact that submenus will be opened in the most intuitive position. They won't get off the screen. The algorithm that does submenu positioning works this way:

  1. Tries to put the newly opened submenu in the bottom of the menu bar. Then it checks for “out-of-window” case. If this happens, then the submenu is moved above the menu bar. Note that there still is room for mistake: if your popup menu is higher than the browser window, then there's nothing we can do about it and it will be partly visible.
  2. Tries to put the newly opened submenu at the right of the opening item. If it fits, it is left that way. If it gets out of the browser window (horizontally) then it will be moved to the left side. The same reserves as for the above rule apply: if your menu is too wide to be visible on screen, then it will be partly visible.

Normally, the reserves above do not happen. If they happen for your menus, then it's clear that you have to rethink and reorganize your menus. Remember this golden rule: if your menu is too long, then people won't browse it. You don't want this to happen. Categorize and organize it (using submenus) so that it fits right.