带悬停下拉链接和可单击链接的引导导航条

Question

我有一个带悬停下拉的引导导航条解决方案。就像这样：http://bootsnipp.com/snippets/E7KEy

我的问题是，我需要在导航栏中的可点击链接。每个下拉的家长都应该是一个链接。目前，“下拉切换”类不允许这样做。

在移动视图中，我需要一个额外的链接来打开下拉列表，因为父项应该保持可点击性。

有什么解决办法吗？

Answer 1

其中一个选项是使用jQuery显示子菜单；以类似的方式引导加载菜单。

下面是这样做的代码，对我来说效果很好：

$('ul.nav li.dropdown, li.dropdown-submenu').hover(function () {
    $('> .dropdown-menu', $(this)).stop(true, true).delay(1000).show();
    $(this).addClass('open');
}, function () {
    $('> .dropdown-menu', $(this)).stop(true, true).delay(1000).hide();
    $(this).removeClass('open');
});

Answer 2

在第55行的css文件中，更改它，用下面的代码替换它。

.navbar-default .navbar-nav .open .dropdown-menu > li > a:click,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
 background-color: #ccc;
}