Question

我是jQuery的新手，我试图制作一个下拉菜单列表。我有以下脚本：

<script>
$(document).ready(function() {
$('.menu>li').hover(function(){
$('.menu>li>ul').slideDown("slow");
});
});
</script>

它会在页面加载后第一次向下滑动下拉列表，但在此之后它只会在页面刷新之前不会向下滑动。如何让它在每个悬停时保持滑动？我尝试了这个，但它也没有用：

<script>
$(document).ready(function() {
$('.menu>li').hover(function(){
$('.menu>li>ul').stop(true,true).slideDown("slow");
});
});
</script>

以下是我正在处理的网站，您可以将鼠标悬停在“练习区”上查看。它的IP 72.41.8.193

感谢。

Answer 1

你告诉jquery将元素向下滑动但从不告诉它再次向上滑动。

hover函数将使用鼠标输入和鼠标输出参数，尝试。

$(document).ready(function() {
    $('.menu>li').hover(function(){
        $('.menu>li>ul').stop(true,true).slideDown("slow");
    }, // <-- this comma is important. 
//the anonymous function after this will run on mouse out
    function(){
        $('.menu>li>ul').stop(true,true).slideUp("slow");
    });
});

Answer 2

您可能需要稍微重构一些代码：

$('.menu > li').hover(function(){
    $(this).find('ul').stop().slideDown('slow'); 
}, function()
    $(this).find('ul').stop().slideUp('slow');
});

您将需要使用this来查找您正在悬停的WHICH菜单项。 .find('ul')将从.menu > li获得下一个最接近的ul。永远记得要停止动画，这样它就不会冒泡，然后记得在你悬停时使用悬停的第二个功能来做某事。

在每个悬停上运行jQuery slideDown

2 个答案: