1

我正在使用 Bootstrap 3 并有一个简单的导航栏，如下所示......

<div class="collapse navbar-collapse" id="navbar-collapse-1">
<ul class="nav navbar-nav">
  <li class="active"><a href="#">Home</a></li>
  <li><a href="#">Item 1</a></li>
  <li><a href="#">Item 2</a></li>
  <li><a href="#">Item 3</a></li>
  <li><a href="#">Item 4</a></li>
</ul>
</div>

这很好用，但我现在希望每个菜单项在悬停时淡入淡出。例如，在悬停时 - 将背景从白色更改为黑色，同时淡出。

这可以使用引导转换吗？或者我是否需要使用 Jquery 独立于 Bootstrap 来执行此操作？任何帮助或代码建议表示赞赏。

4

1 回答 1

4

只需在悬停时为锚元素添加颜色和背景，就像这样：

.navbar .nav > li > a {
    -webkit-transition: all ease .3s;
       -moz-transition: all ease .3s;
         -o-transition: all ease .3s;
            transition: all ease .3s;
}

.navbar .nav > li > a:hover {
    background-color: #000;
    color: #fff;
}

检查这个小提琴：http: //jsfiddle.net/thiagobraga/6yA9h/

于 2013-11-14T14:34:25.443 回答