让jquery垂直下滑菜单保持打开状态

Question

一个菜鸟问题。答案可能非常简单，但不知何故，我无法弄清楚，并且需要继续我的项目。

我有一个垂直导航菜单，并且悬停时可以向下滑动。 但我希望菜单在滑落后保持打开状态。 我尝试删除最后一行代码，但这看起来不太漂亮。

我尝试实现 Stu Nicholls 方法 ，但没有得到它去工作。但这就是我想要的效果。

我的 HTML 菜单是：

<nav id="verticalmenu">          
<ul>
  <li><a class="slide" href="#">Kalendarium</a>
  <ul class="down">
    <li><a href="#">Konzerte</a></li>
    <li><a href="#">Seminare</a></li>
    <li><a href="#">Vortraege</a></li>
  </ul>
</li>
<li><a href="#">Projekte</a>
  </ul>

和它的 jquery：

<script type="text/javascript">



 (function($){

            //cache nav
            var nav = $("#verticalmenu");

            //add hovers to submenu parents
            nav.find("li").each(function() {
                if ($(this).find("ul").length > 0) {


                    //show subnav on hover
                    $(this).mouseenter(function() {
                        $(this).find("ul").stop(true, true).slideDown();
                    });

                    //hide submenus on exit
                    $(this).mouseleave(function() {
                        $(this).find("ul").stop(true, true).slideUp();
                    });
                }
            });
        })(jQuery);

多谢！

Answer 1

只需在文档加载时隐藏它们即可。不需要 if 检查，jquery 在内部进行此

(function($){
     var nav = $("#verticalmenu");
        //add hovers to submenu parents
        nav.find("li").each(function() {
            var li_ul = $(this).find("ul");
                li_ul.hide();
                //show subnav on hover
                $(this).mouseenter(function() {
                    li_ul.stop(true, true).slideDown();
                });
        });
})(jQuery);

操作： http://jsfiddle.net/Redwb/3/