Events API

The Events API allows you to trigger your code when menu events occur.

ubermenuopen

Fires when a submenu is activated.

Examples

When menu item 28’s submenu is opened, show an alert

jQuery( '#menu-item-28' ).on( 'ubermenuopen', function(){
  //Your code here
  alert( 'Menu Opened' );
});

ubermenuclose

Fires when a submenu is hidden.

Examples

When menu item 28’s submenu is closed, show an alert

jQuery( '#menu-item-28' ).on( 'ubermenuclose', function(){
  //Your code here
  alert( 'Menu Closed' );
});

ubermenutoggledopen

Since UberMenu v3.2.1

Fires on the responsive toggle button when toggled open

Example

When the menu is toggled open, show an alert

jQuery( '.ubermenu-responsive-toggle' ).on( 'ubermenutoggledopen' , function(e){
  //Your code here
  alert( 'Menu Toggled Open' );
});

ubermenutoggledclose

Since UberMenu v3.2.1

Fires on the responsive toggle button when toggled closed

Example

When the menu is toggled closed, show an alert

jQuery( '.ubermenu-responsive-toggle' ).on( 'ubermenutoggledclose' , function(e){
  //Your code here
  alert( 'Menu Toggled Closed' );
});

ubermenuscrollto_complete

Since UberMenu v3.2.1

Fires on the anchor after a Scroll To animation has been completed.

Example

When a ScrollTo link is clicked, display an alert after the scroll completes

jQuery( '.ubermenu-target' ).on( 'ubermenuscrollto_complete' , function(){ 
  alert( 'scrollto complete' ); 
});

ubermenu-resize-desktop

Since UberMenu v3.7

Fires when the menu transitions from mobile format to desktop format

jQuery( window ).on( 'ubermenu-resize-desktop', function(){ 
  console.log( 'Transitioned to desktop mode' ); 
});

ubermenu-resize-mobile

Since UberMenu v3.7

Fires when the menu transitions from desktop format to mobile format

jQuery( window ).on( 'ubermenu-resize-mobile', function(){ 
  console.log( 'Transitioned to mobile mode' ); 
});