如何使悬停而不是点击

我已经建立了一个基于bootstrap for wordpress版本的自定义WordPress主题，我试图让下拉导航栏在悬停而不是点击时打开。如何使悬停而不是点击

我在这里找到了this answer，但它似乎解决了原始（无wordpress）bootstrap。无论是这样或者它只是不清楚如何实现它，但它看起来像wordpress只是不同。

我几乎设法通过在bootstrap-dropdown.js文件中将“click”替换为“hover”来完成它，但是实际上我无法将鼠标移动到子菜单项，因为只要我下拉菜单消失移动光标，下拉菜单不会保持打开状态。

理想情况下，它将悬停在桌面上，仍然点击移动设备，但这不是必须的。我会牺牲点击手机悬停在桌面上。

如果任何人都可以提供帮助，那就太棒了。

2012-06-13 James

我所做的就是这一行添加到我的bootstrap.css附近的下拉菜单花式：

.dropdown.open .dropdown-menu { 
    .......... 
/*--- Hover Dropdown Menu---*/ 
ul.nav li.dropdown:hover ul.dropdown-menu { 
    display: block;  
} 
.dropdown-menu:before { 
............

希望有所帮助。

来源

2012-07-18 22:47:47 LearningRoR

有三个步骤来解决这个问题：

1）就在这个代码添加到主题中发现的bootstrap.css - >库 - > CSS - > bootstrap.css

ul.nav li.dropdown:hover ul.dropdown-menu { 
display: block;  
}

这是快速修复只是使用CSS，而不是触及Javascript或JQuery。但是，当您悬停菜单时，这可能会导致一些错误的UI行为。

2）您将无法链接到父类别。为了解决这个问题去你的主题的functions.php和删除此线417：

class="dropdown-toggle" data-toggle="dropdown"

所以你的行会：

$attributes .= '';

3）如果将光标从太慢父类别到下拉菜单菜单将关闭。这是因为剩余的余量。为了解决这个问题的bootstrap.css添加第一个代码下面这段代码：

.navbar .dropdown-menu { 
margin-top: 0px; 
}

就是这样，你的WordPress主题引导程序现在应该没有点击父类别以显示下拉菜单。

来源

2013-01-10 01:25:02

这适用于WordPress的引导：

.navbar .nav > li > .dropdown-menu:after, .navbar .nav > li > .dropdown-menu:before { 
    content: none; 
}

来源

2013-03-15 18:53:39

如何使悬停而不是点击

回答

相关问题