我想有我的引导菜单自动下拉悬停,而不是必须点击菜单标题。我还想去掉菜单标题旁边的小箭头。
当前回答
$('.dropdown').hover(function(e){$(this).addClass('open')})
其他回答
这里有很多非常好的解决方案。但我想我还是把我的放在这里作为另一种选择。这只是一个简单的jQuery代码片段,如果它支持悬停下拉而不是单击,它就会以引导的方式完成。我只测试了版本3,所以我不知道它是否适用于版本2。将其保存为编辑器中的一个片段,按一下键就可以看到它。
<script>
$(function() {
$(".dropdown").hover(
function(){ $(this).addClass('open') },
function(){ $(this).removeClass('open') }
);
});
</script>
基本上,它只是说当你悬停在下拉类上时,它会向它添加开放类。这样就可以了。当您停止在带有下拉类的父类li或子类ul/li上悬停时,它将删除打开类。显然,这只是众多解决方案中的一个,您可以对其进行添加,使其仅适用于.dropdown的特定实例。或者向父级或子级添加转换。
$('.dropdown').hover(function(e){$(this).addClass('open')})
这适用于WordPress Bootstrap:
.navbar .nav > li > .dropdown-menu:after,
.navbar .nav > li > .dropdown-menu:before {
content: none;
}
我已经使用了一点jQuery:
// Add hover effect to menus
jQuery('ul.nav li.dropdown').hover(function() {
jQuery(this).find('.dropdown-menu').stop(true, true).delay(200).fadeIn();
}, function() {
jQuery(this).find('.dropdown-menu').stop(true, true).delay(200).fadeOut();
});
这将隐藏下拉列表和它们的插入符号,如果它们比平板电脑小。
@media (max-width: 768px) {
.navbar ul.dropdown-menu, .navbar li.dropdown b.caret {
display: none;
}
}