jQuery slideDown菜单在第二次悬停之前不起作用

Question

我拥有的：

我有一个基本的下拉列表，我在悬停时使用jQuery进行slideUp和slideDown。

我需要什么：

我需要在第一个悬停时下拉到slideDown，然后每个悬停。目前，第一个悬停始终被忽略。 slideDown在第二次悬停之前不会生效。

实施例

https://jsfiddle.net/tbc3rkk3/2/

请注意：

1. 此示例中不会出现此问题，但代码应该提供必要的上下文。
2. 我无法链接到我正在开发的网站的实时版本。

我尝试了什么：

已存在a very similar question on StackOverflow。

所选答案表明，通过CSS，我将ul设置为display:none;，但这已经在我的案例中应用了。

我的问题：

为什么第一个悬停/ slideDown被阻挡？

Answer 1

为什么不使用slideToggle？

$("#language").on('click', function () {
    $(".language_dropdown").slideToggle("slow");
});

See my JSFiddle

注意：建议不要在悬停时执行此功能，因为它会更频繁地触发，并且手机和平板电脑上的用户无法正确处理。点击是一种更好的方法。请参阅我更新的JSFiddle。

Answer 2

您必须删除此部分才能使动画正常工作：

#language:hover .language_dropdown {
    display: block;
}

See this fiddle

注意：您还可以添加stop()功能，以防止多个悬停无用的动画。

$("#language").hover(function () {
    $(".language_dropdown").stop().slideDown("slow");
}, function() {
    $(".language_dropdown").stop().slideUp("slow");
});