-1
我在導航欄中創建了一個下拉菜單，但當我將其懸停時，它不起作用。導航欄下拉菜單在引導程序中不起作用
我的模板，
<header id="header" class="sticky-header" data-sticky-class="not-dark" >
<div id="header-wrap">
<div class="container clearfix">
<div class="divcenter" style="max-width:990px;">
<div id="primary-menu-trigger"><i class="icon-reorder"></i></div>
<!-- Logo
============================================= -->
<div id="logo" style="margin-top: 5px;">
<a href="#" class="standard-logo" data-dark-logo="images/logo-dark.png"><img src="assets/images/SW-Logo-Final.png" alt="Canvas Logo"></a>
</div>
<span class="inputgroupcss col-sm-5" style="padding-top:12px;">
<input type="email" (keyup)="submit(button1.value)" #button1 class="form-control required email" placeholder="Search by Name or Email"
style="height:38px;">
<div class="col-sm-12 nopadding ">
<ul class="searchlist">
<li *ngFor="let detail of details">
<img [src]='detail.image' alt="profile_image" style="width: 35px;
height: 35px;">
<a (click)="redirect()" [routerLink]="['/demo/user',detail.profilename]">{{detail.profilename}}</a>
</li>
</ul>
</div>
</span>
<!-- #logo end -->
<!-- Primary Navigation
============================================= -->
<!-- <nav id="primary-menu" class="pull-left" style="margin-top:11px">
<form style="width:300px" id="widget-subscribe-form2" action="include/subscribe.php" role="form" method="post" class="nobottommargin">
<div class="input-group input-group-lg divcenter" style="max-width:600px;">
<input type="email" name="widget-subscribe-form-email" class="form-control required email" placeholder="Search by Name or Email" style="height:38px;">
<span class="input-group-addon" style="height: 38px;padding: 6px 16px;"><i class="icon-line-search"></i></span>
</div>
</form> <div *ngFor="let id of ids" class = "nopadding col-sm-12">
<button class="badge notification" (click) = 'getRequests()'>
<span class="glyphicon glyphicon-bell"></span>
</button>
<span class="noti"> {{id.sent_id}}</span>
</div>
</nav> -->
<nav id="primary-menu" class="dark">
<ul>
<li class="onhovercolor">
<a href="#">
<div>srilatha mattepu</div>
</a>
</li>
<li id="top-cart" class="onhovercolor notopmargin noleftpadding" *ngFor="let id of ids"><a href="#" class="noleftpadding" id="top-cart-trigger"><i class="icon-email3" style="font-size:18px;color: #d35b29;"></i><span>{{id.sent_id}}</span></a>
<div class="top-cart-content">
<div class="top-cart-title">
<h6 class="nobottommargin text-center">You have {{id.sent_id}} Requests pending</h6>
</div>
<div class="col-xs-12 dropdownpanel">
<h6 class="nobottommargin">Friend Requests</h6>
</div>
<div class="col-xs-12 dropdownpanel">
<div class="col-xs-3 nopadding">
<img src="assets/images/gallery3.png" style="height:45px;width:50px">
</div>
<div class="col-xs-6 nopadding">
<h5 class="nobottommargin pendingnamescss">srilatha mattepu</h5>
</div>
<div class="col-xs-3 nopadding text-right">
<a href="#" class="norightmargin button buttonwarning button-mini button-aqua" style="width:auto !important;">pending</a>
</div>
</div>
<div class="col-xs-12 dropdownpanel">
<div class="col-xs-3 nopadding">
<img src="assets/images/gallery3.png" style="height:45px;width:50px">
</div>
<div class="col-xs-6 nopadding">
<h5 class="nobottommargin requestsnamecss">srilatha mattepu</h5>
</div>
<div class="col-xs-3 nopadding text-right">
<a href="#" class="norightmargin button buttonwarning button-mini button-aqua" style="width:auto !important;">pending</a>
</div>
</div>
</div>
</li>
<li class="onhovercolor norightpadding">
<div class="downarrowcss"><i class="icon-caret-down" style="font-size:25px !important"></i></div>
<ul class="menu-pos-invert">
<li>
<a href="/demo/profile">
<div><i class="icon-user"></i> My Profile</div>
</a>
</li>
<li>
<a href="/demo/settings">
<div><i class="icon-settings"></i> Settings</div>
</a>
</li>
<li>
<a href="/demo/password">
<div><i class="icon-settings"></i> Change Password</div>
</a>
</li>
<li>
<a href="#">
<div><i class="icon-off"></i> Logout</div>
</a>
</li>
</ul>
</li>
<li class="onhovercolor hidden-sm hidden-md visible-xs">
<a href="#">
<div>srilatha mattepu</div>
</a>
<ul>
<li><a href="/demo/profile">PROFILE</a></li>
<li><a href="/demo/social">SOCIAL ADDRESSES</a></li>
<li class="list-borbtom"><a href="/demo/custom">CUSTOM INFO</a></li>
<li><a href="/demo/society">MY SOCIETY<span>(ALL)</span></a></li>
<ul class="left-sub-list">
<li><a href="/demo/personal" style="padding-left:15px" href="#">PERSONAL</a></li>
<li><a href="/demo/professional" style="padding-left:15px" href="#">PROFESSIONAL</a></li>
</ul>
<li><a href="/demo/requests">REQUESTS</a></li>
<li><a href="/demo/society">MESSAGES</a></li>
<li class="list-borbtom"><a href="/demo/society">SOCIETY UPDATES</a></li>
<li class="list-borbtom"><a href="/demo/search">SEARCH</a></li>
<li class="list-borbtom"><a href="/demo/password">PASSWORD</a></li>
<li><a href="/demo/settings">SETTINGS</a></li>
<li><a href="#" style="color:#ce5a2b;">LOGOUT</a></li>
<li><a href="#" style="color:#ce5a2b;">Qr Code</a></li>
</ul>
</li>
</ul>
</nav>
<!-- #primary-menu end -->
</div>
</div>
</div>
</header>
我創建了一個下拉我來回導航欄菜單，但是當我將鼠標懸停於它，它不工作。
該引導程序Navbar下拉菜單正在處理單擊而不是懸停。所以你必須定製你的代碼來打開懸停的代碼。 –
清理你的代碼並創建一個最簡單的例子。 – ZimSystem
請創建一個[** JSFiddle **]（https://jsfiddle.net）並學習[**如何創建一個最小，完整和可驗證的示例**]（http://stackoverflow.com/help/ mcve） – vivekkupadhyay