Wijmo UI for the Web
wijmenu jQuery Widget
Create multi-level menus with animation effects, images and check box items, interactive item scrolling, and even create a pop-up menu for context help within your application.
Syntax
$(function () {
    var options; // Type:  wijmo.menu.wijmenu.options
     
    $(".selector").wijmenu(options);
});
function wijmenu() : any;
Options
 NameDescription
public Option

Type: wijmo.menu.wijmenu_animation

The animation option determines the menu animation if the showAnimation and hideAnimation properties are not individually specified. For a description of the animation effects and the easing effects, please see the Animation page.

 
public Option

Default value: true

This option determines whether the iPod-style menu shows a back link or a breadcrumb header in the menu.

 
public Option

Default value: 'Back'

This option sets the text of the back link.

 
public Option

Default value: false

When you set the checkable option to true and click on a menu item, the clicked item's state will be selected. A "ui-state-active" class will be added to the item so that the item behavior and the item appearance are different.

 
public Option

Default value: 'Choose an option'

A value that sets the top breadcrumb's default text.

 
public Option

Default value: 'ltr'

A value that indicates menu's direction.

 
public Option

Default value: false

A value indicating the submenu element will be append to the body or menu container.

 
public Option

Type: wijmo.menu.wijmenu_animation

Determines the animation used to hide submenus.

 
public Option

Default value: 400

This option determines how many milliseconds to delay before hiding the submenu in a fly-out menu.

 
public Option

Default value: null

The options of child items

 
public Option

Default value: 200

This option determines the iPod-style menu's maximum height.

 
public Option

Default value: 'flyout'

The mode option defines the behavior of the menu, whether it is a pop-up menu or an iPod-style navigation list.

 
public Option

Default value: 'horizontal'

This option controls the root menu's orientation. All submenus are vertical regardless of the orientation of the root menu.

 
public Option

The position option specifies the location and orientation of the menu relative to the button or link used to open it.

 
public Option

This option determines the animation effect, the duration, and the easing effect used to hide the submenus. You can also use this option to set any animation-specific options, such as direction.

 
public Option

Default value: 400

This option determines how many milliseconds to delay before showing the submenu in a fly-out menu.

 
public Option

Type: wijmo.menu.wijmenu_slidingAnimation

This option defines the animation used to slide a submenu when in sliding mode.

 
public Option

Default value: 'default'

The submenuTriggerEvent option specifies the mouse event used to show the submenu. If submenuTriggerEvent is 'default', it will get value from triggerEvent option.

 
public Option

Default value: null

This option specifies a hash value that sets to superpanel options when a superpanel is created. It is used to set appearances and behaviors when a scrollbar is shown in sliding mode.

 
public Option

Default value: 'All'

A value that sets the text of the top link.

 
public Option

Default value: ""

The trigger option handles the open event for the menu or submenu. This option must be used with the triggerEvent option.

 
public Option

Default value: 'click'

The triggerEvent option specifies the mouse event used to show the menu or submenu. triggerEvent must be used with the trigger option.

 
Top
Methods
 NameDescription
public MethodThis method activates a menu item by deactivating the current item, scrolling the new item into view, and, if necessary,making it the active item, and triggering a focus event.  
public MethodAdds a child menuItem to the menuItem.  
public MethodThe deactivate method clears the current selection. This method is useful when reopening a menu which you previously selected an item. If you don't call this method then an item which you selected before allowing the menu to close will remain highlighted when the menu is reopened.  
public MethodThe destroy method removes the wijmenu functionality completely and returns the element to its pre-init state.  
public MethodThe first method defines the first menu item as the active item.  
public MethodGets the collection of child items.  
public MethodThe hideAllMenus method hides all menu items currently showing.  
public MethodThe last method defines the last menu item as the active item.  
public MethodThe next method gets the next selectable item. The first item is selected if no item is active or the last one is active. It returns null if none is selectable.  
public MethodThis method is similar to the "next" method, but it jumps a whole page to the next page instead of to the next selectable item. You can call this method when you are using an iPod-style menu.  
public MethodGet the previous selectable item. It selects the last item if no item is active or if the first item is active. It returns null if no previous item is selectable.  
public MethodThis method is similar to the "previous" method, but it jumps a whole page to the previous page. You can call this method when you're using an iPod-style menu.  
public MethodThe method is used to refresh the menu when DOM operations add or replace a menu item. For example, if you add a new menu item through "menu.append," then you can use the refresh method to make sure that the new menu item appears in the menu.  
public MethodRemove an item from the menu.  
public MethodThis method selects the active item which triggers the select event for that item. This event is useful for custom keyboard handling.  
public MethodThe setItemDisabled method allows the user to disable a specific menu item.  
public MethodReturns a jQuery object containing the original element or other relevant generated element.  
Top
Events
 NameDescription
public EventThe blur event is triggered when a menu item loses focus. You can use this event to track which item has lost focus. An item can lose focus through keyboard commands, such as when the Tab key is pressed, or when a user clicks elsewhere on the page.  
public EventThe focus event is triggered either on mouse hover or when the keyboard cursor keys are used for navigation. In general, an item or element that has focus is highlighted in some way. When an item or element has focus it is the first to receive keyboard-related events.  
public EventThe hidden event is triggered after the menu or submenu is hidden.  
public EventThe hidding event is triggered before hidding the menu or submenu. This event can be cancelled with "return false";  
public EventThe select event is triggered when a menu item is selected. This event can be triggered by theselect method to allow for custom keyboard handling.  
public EventThe showing event is triggered before the submenu is shown. showing is a useful event if you want to perform a function before the submenu is shown or if you want to block the submenu from showing by returning false.  
public EventThe shown event is triggered after the menu or submenu is shown.  
Top
See Also

Widgets

Menu

Reference

wijmenu jQuery Widget