I'm having an issue with the navbar where a "flash" appears when you click outside the menu to close the menu. The flash persists if the mouse is held down when clicking out of the menu as shown here:
我在导航栏中遇到问题，当您在菜单外部单击以关闭菜单时会出现“闪烁”。如果在单击菜单时按住鼠标，闪烁仍然存在，如下所示：
I'm thinking it might have something to do with angular, and not css, mainly because others have failed to replicate it on fiddle. Previous question here.
我认为它可能与角度有关，而不是css，主要是因为其他人未能在小提琴上复制它。先前的问题在这里
HTML:
HTML：
<nav class='navbar navbar-default.navbar-static-top navbar-custom'>
<div class='container-fluid'>
<ul class='nav navbar-nav navbar-left'>
<li><a href="dashboard.html">Dashboard</a></li>
<li><a href="/grades">Grades</a></li>
<li><a href="/classes">Classes</a></li>
</ul>
<ul class='nav navbar-nav navbar-right'>
<li><a href="/messages"><i class="fa fa-envelope fa-lg"></i></a></li>
<!--has to do with the link, clicking it and clicking it again-->
<li><a class="dropdown-toggle dropdown-custom" data-toggle="dropdown" href="/profile"><i class="fa fa-user fa-lg"></i></a>
<ul class="dropdown-menu">
<li><a href="/profile.html">Edit profile</a></li>
<li><a href="/settings">Edit Preferences</a></li>
</ul>
</li>
<li><a href="/logout"><i class="fa fa-power-off fa-lg"></i></a></li>
</ul>
</div>
</nav>
CSS:
CSS：
[ng\:cloak], [ng-cloak], .ng-cloak {
display: none !important;
}
.navbar-custom {
background-color: #586F7C;
}
.navbar-custom a {
color: #F4F4F9;
}
.navbar-custom .nav > li > a:hover {
background-color: #2F4550;
}
.navbar .navbar-nav > li.open > a, {
background-color: #586F7C;
}
.navbar .navbar-nav > li.open > a:hover,
.navbar .navbar-nav > li.open > a:focus {
background-color: #2F4550;
}
.nav >li > a:hover, .nav > li > a:focus {
background-color: #586F7C;
}
ng-include in the file the navbar is referenced in
ng-include在文件中引用了导航栏
<div ng-include="'html/navbar.html'"></div>
portion of index.html where it references the file that the navbar is ng-included in
index.html的一部分，它引用了导航栏包含的文件
<body>
<div class="view-container">
<div ng-view class="view-frame"></div>
</div>
</body>
I'm thinking the issue might be with the ng-view or ng-include, however so far none of the fixes in the previous question worked.
我认为这个问题可能与ng-view或ng-include有关，但到目前为止，上一个问题中没有任何修复工作。
3 个解决方案
#1
2
One quick hack may be adding this to your css
一个快速黑客可能会将此添加到您的CSS
.nav >li > a:hover, .nav > li > a:focus {
background-color: #586F7C;
}
Edit: I just realized you've already seen such a solution in another thread, but I was able to replicate "your bug". Here is a bootply, just try to comment out the css and the bug will be present, with css it's working as expected.
编辑：我刚刚意识到你已经在另一个线程中看到过这样的解决方案，但我能够复制“你的错误”。这是一个bootply，只是尝试注释掉css并且bug将会出现，css正如预期的那样工作。
#2
0
The issue was here:
问题在于：
.navbar .navbar-nav > li.open > a, {
background-color: #586F7C;
}
That extra "," was the problem. So it ended up to just be a syntax error, how embarrassing haha. No wonder it seemed like everything should be working, it was just a little comma in the wrong place!
额外的“，”就是问题所在。所以它最终只是一个语法错误，多么令人尴尬哈哈。难怪一切都应该工作，这只是一个错误的地方的小逗号！
#3
0
A little jQuery will solve the problem. Just add the following for the anchor tags which are flashing.
一个小jQuery将解决问题。只需为闪烁的锚标签添加以下内容即可。
```
```
$('.navbar-custom .navbar-nav li a').on('mouseup', function(){
$(this).blur();
});
```
```
#1
2
One quick hack may be adding this to your css
一个快速黑客可能会将此添加到您的CSS
.nav >li > a:hover, .nav > li > a:focus {
background-color: #586F7C;
}
Edit: I just realized you've already seen such a solution in another thread, but I was able to replicate "your bug". Here is a bootply, just try to comment out the css and the bug will be present, with css it's working as expected.
编辑：我刚刚意识到你已经在另一个线程中看到过这样的解决方案，但我能够复制“你的错误”。这是一个bootply，只是尝试注释掉css并且bug将会出现，css正如预期的那样工作。
#2
0
The issue was here:
问题在于：
.navbar .navbar-nav > li.open > a, {
background-color: #586F7C;
}
That extra "," was the problem. So it ended up to just be a syntax error, how embarrassing haha. No wonder it seemed like everything should be working, it was just a little comma in the wrong place!
额外的“，”就是问题所在。所以它最终只是一个语法错误，多么令人尴尬哈哈。难怪一切都应该工作，这只是一个错误的地方的小逗号！
#3
0
A little jQuery will solve the problem. Just add the following for the anchor tags which are flashing.
一个小jQuery将解决问题。只需为闪烁的锚标签添加以下内容即可。
```
```
$('.navbar-custom .navbar-nav li a').on('mouseup', function(){
$(this).blur();
});
```
```