PopMenu Examples

Basic Context Menu

This example demonstrates how easy it is to create a basic context menu that just works. You could assign a link to a menu item by specifying href option, or a callback by specifying action option.

You could also navigate the context menu using keyboard! Try clicking on the button, and press [context menu] button on the keyboard. Navigate using [up] and [down] arrow buttons. Press [enter] or [space] bar to select.

More Options for Context Menu Item

This example demonstrates a context menu creation with various options, such as:

Dynamic Labels

A function instead of string can be assigned as menu item labels.

Alternative Menu Item Creation

Beginning with an empty context menu, this example demonstrates various methods to add/remove menu items after a context menu is initialized.

Single Context Menu Assigned to Multiple Elements

Multiple elements can share a single instance of context menu. In this way, any operations made to the context menu of an element will affect others as well.

Submenus and Long Menu List

PopMenu is able to handle long list of menu items and unlimited submenus.

Showing Context Menu with Left Click

Context menu can be triggered using left click by calling $(elm).popmenu('show') and optionally passing onclick event argument to position the menu under mouse cursor.