JQuery UI Меню анимации

Question

Я пытаюсь анимировать встроенную функцию меню JQuery UI. Я перепробовал много разных способов, и я думаю, что он должен иметь какое-то отношение к событию "focus", вот код, который у меня есть, но он фактически не выскользнет из меню, что я не так делаю?

$('.nav-menu').menu({
    position: {     my: "left top", 
            at: "left bottom", 
            collision: "none"
        },
    focus: function(even,ui){
            $(this).next("ul").slideDown("slow");
        }
    });

Любая помощь будет принята с благодарностью.

Редактировать:

HTML структура для меню:

<div class="menu">
    <div class="menu-main-menu-container">
        <ul id="menu-main-menu" class="nav-menu">
            <li id="menu-item-409" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-409"><a href="">HOME</a></li>
            <li id="menu-item-466" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-466"><a>Zenair CH801HD <span class="caret"></span></a>
                <ul class="sub-menu">
                    <li id="menu-item-482" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-482"><a href="">801 News</a></li>
                    <li id="menu-item-480" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-480"><a href="">Horizontal Tail Build</a></li>
                    <li id="menu-item-467" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-467"><a href="">Everything Unfiltered</a></li>
                </ul>
           </li>
           <li id="menu-item-5" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-5"><a>Projects <span class="caret"></span></a>
               <ul class="sub-menu">
                   <li id="menu-item-408" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-408"><a href="">(APP-02)</a></li>
                   <li id="menu-item-412" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-412"><a href="">GoPro Gimbal Mount</a></li>
                   <li id="menu-item-411" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-411"><a href="">Garage Build</a></li>
             </ul>
        </li>
        <li id="menu-item-277" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-277"><a>Bearhawk <span class="caret"></span></a>
            <ul class="sub-menu">
                <li id="menu-item-414" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-414"><a href="">About The Bearhawk</a></li>
                <li id="menu-item-413" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-413"><a href="">Bearhawk Modeling</a></li>
            </ul>
       </li>
       <li id="menu-item-139" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-139"><a href="">About</a></li>
   </ul>
</div>      
</div>

Я попытался немного очистить код здесь, это структура меню. Полная незавершенная работа доступна на http://sdlan.org/~mnewman