如何在鼠标悬停时在 Bootstrap 菜单项中包含编辑、删除图标。并且当点击编辑/删除图标时,它应该分别调用编辑/删除方法。
需要在下面的 bootstrap 下拉菜单中实现这一点,
<div class="dropdown">
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Dropdown Example
<span class="caret"></span></button>
<ul class="dropdown-menu">
<li><a href="#">HTML</a></li>
<li><a href="#">CSS</a></li>
<li><a href="#">JavaScript</a></li>
</ul>
</div>
将鼠标悬停在附近应显示“编辑/删除”图标的 HTML/CSS/JavaScript 菜单项上。
最佳答案
我已经用 CSS 做到了这一点,但还有很多方法。
您可以通过在 <i>
上添加点击事件来调用编辑或删除功能。使用适当的类名标记。
ul>li>a:hover i{
display:block !important;
float:right !important;
}
ul>li>a>i{
display:none !important;
}
.glyphicon-edit{
padding-left:7%;
}
工作 jsfiddle: https://jsfiddle.net/6v4d7kg9/
关于javascript - 鼠标悬停在菜单项上的 Bootstrap 下拉菜单应在右侧显示编辑/删除图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38829196/