jQuery slideDown 菜单直到第二次悬停才起作用

Question

我有：

我有一个基本的下拉列表，我正在使用它 jQuery 在悬停时向上滑动和向下滑动。

我需要的：

我需要在第一次悬停时和之后的每次悬停时下拉到 slideDown。目前，第一次悬停总是被忽略。 slideDown 直到第二次悬停才生效。

示例：

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

请注意：

此示例中没有出现问题，但代码应该同样提供必要的上下文。
我无法 link 我正在开发的网站的实时版本。

我尝试过的：

已经存在 a very similar question on Whosebug.

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

我的问题：

为什么第一个 hover/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");
});

jQuery slideDown 菜单直到第二次悬停才起作用

jQuery slideDown menu doesn't work until 2nd hover

html

css

jquery

hover

我有：

我需要的：

示例：

我尝试过的：

我的问题：