我使用 jQuery 脚本实现了延迟,但我需要更改我的 html,因此它现在不是 Bootstrap 标准下拉列表,但它只有一些位置更改和类更改,所以不确定为什么它没有延迟。我希望延迟显示在电话号码下拉列表中... http://bootply.com/67110
Javascript
$("ul.dropdown").hover(function() {
$(this).find(".dropdown-menu").stop(true, true).delay(350).fadeIn();
}, function() {
$(this).find(".dropdown-menu").stop(true, true).delay(200).fadeOut();
});
HTML
<ul class="pull-right dropdown inline"><a href="#" class="dropdown-toggle" data-toggle="dropdown"><li>Call us on 0844 873 0070 <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Second level link</a></li>
<li><a href="#">Second level link</a></li>
<li><a href="#">Second level link</a></li>
<li><a href="#">Second level link</a></li>
<li><a href="#">Second level link</a></li>
</ul></li>
</ul>
最佳答案
你的CSS有
ul.dropdown:hover ul.dropdown-menu {
display: block;
}
自动显示菜单。您要么需要删除它,要么缩小其范围以覆盖更少的元素。
关于悬停时的 jQuery 下拉延迟在 Bootstrap 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17592604/