Edit in JSFiddle

$( document ).ready( function() {

  $( "#menu li" ).hover( 
    function() {
      $( this ).find( "ul" )
        .stop( true, true )
        .slideDown( 400, "easeOutBounce", function() { 
          $( this ).trigger( "opened" ); 
        });
    }, 
    function() {
      $( this ).find( "ul" )
        .stop( true, true )
        .slideUp( 400, "easeOutBounce", function() { 
          $( this ).trigger( "closed" ); 
        });
    });
  
  $( "#menu" ).on( "opened closed", "ul", function( e ) {
    console.log( "menu ul was: " + e.type );
  });

});