jQuery SlideDown/slideUp 问题

标签 jquery slidedown slideup

我对 SlideDown/SlideUp 有一个小问题。我有一个里面有子菜单的菜单,我想要实现的是在菜单鼠标悬停时显示子菜单,我这样做是这样的:

<script type="text/javascript">
$(document).ready(function(){
        $("#menu>li>ul").hide();
        $("ul#menu>li a").mouseover(function(){                     
            $(this).next("ul").slideDown('1000');
            $(this).next("ul").addClass("current_submenu");     
        });
        $(".submenu>li").click(function(){                          
            $(".current_submenu").slideUp('1000');          
        }); 
});
</script>
<ul id="menu">
             <li><a class="album" id="beauty-fashion" href="#">Beauty/Fashion</a>
                <ul>
                    <li><a href="#">Beauty 1</a></li>
                </ul>
             </li>             
             <li><a class="album" id="covers" href="#">Covers</a></li>
             <li><a class="album" id="editorial" href="#">Editorial</a></li>
             <li><a class="album" id="advertising" href="#">Advertising</a></li>
             <li><a class="album" id="fx" href="#">FX</a></li>
             <li><a class="album" id="portraits" href="#">Portraits</a></li>
             <li><a class="album" id="taly" href="#">Taly</a></li>
             <li><a class="disabled" href="#" id="previousImage">Previous</a></li>
             <li><a href="#" id="toggleAnimation">Pause</a></li>
             <li><a class="disabled" href="#" id="nextImage">Next</a></li>
</ul>

子菜单向下滑动,但是当我从中移出鼠标时,它不会再次向上滑动。 ¿我做错了什么?

非常感谢大家的帮助!

最佳答案

这个 JavaScript 应该可以工作:

$(document).ready(function(){
    $("#menu>li>ul").hide();
    $("ul#menu>li").hover(function(){                     
        $(this).find("ul").slideDown(200).addClass("current_submenu");
    }, function(){
        $(this).find("ul").slideUp(200).removeClass("current_submenu");
    });
});

看看http://api.jquery.com/hover/了解它如何成为 mouseenter 和 mouseleave 的简写。

我还注意到你的slideUp和slideDown时间是作为字符串插入的。它应该是一个整数,或者类似“快”或“慢”的预定义时间。

关于jQuery SlideDown/slideUp 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6040975/

相关文章:

javascript - 如何让我的 div 向下滑动 JQuery

jQuery 通过向上滑动/向下滑动替换淡入淡出效果

mobile - Flutter 中的上滑 View

javascript - 如何判断哪个ajax请求失败了?

JQUERY 使用动画在 UL 前面添加 LI

jquery - 单击链接时使列表向下滑动

java - 一个向上滑动的面板,就像具有中间状态的谷歌地图应用程序

php - 页面加载后平滑滚动到 div,而不是直接滚动

javascript - 链接到 Bootstrap 折叠元素内部的元素

javascript - 向表条目添加超链接