Popup Menus

Popup menus are a simple but effective solution to the problem that context dependent commands like "Delete", "Show", "Open" cannot be easily mapped to standard gestures. Depending on the application popup menus can be assigned to taps, long or forced presses or explicit interface elements like buttons.

Let's look at an example of a popup menu. It is good practice to use the oncontextmenu handler with a return value of false to ensure that the applications context menu is called instead of the browser context menu:


oncontextmenu="PopupMenu.open(cmds,
        { x: event.offsetX, y: event.offsetY}, 
        { parent: example,
          keepWithin: example
        }); return false;"

Note that the notch position depends on the event location of the opening event. Note that the position of the open command must be in the coordinates of the parent node.

Sometimes popup menus are used within scaled, rotated, and translated DOM containers. Click into the following scaled (0.5) and rotated container.