2016-01-07 3 views
0

Он обычно рушится на небольших устройствах. Нажатие на кнопку меню расширяет меню, но если я нажму (или коснусь этого) на панели переключения, меню останется открытым. Что мне нужно сделать, чтобы снова закрыть его.Переключатель бутстрапа не закрывается после открытия

<nav class="navbar navbar-inverse"> 
     <div class="navbar-header"> 
      <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".js-navbar-collapse"> <span class="sr-only">Toggle navigation</span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 

      </button> <a class="navbar-brand" href="#">testing</a> 

     </div> 
     <div class="navbar-collapse collapse js-navbar-collapse"> 

<ul class="nav navbar-nav"> 

     <li><a style="width:113px !important" href="/admin/index">Dashboard</a></li> 
      </ul> 
      <ul class="nav navbar-nav"> 
         <li><a style="width:113px !important" href="/admin/ListEmployers">Employers</a></li> 

      </ul> 
      <ul class="nav navbar-nav"> 


       <li class="dropdown mega-dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Manage <span class="glyphicon glyphicon-chevron-down pull-right"></span></a> 

        <ul class="dropdown-menu mega-dropdown-menu row"> 

         <li class="col-sm-3"> 
          <ul> 
           <li class="dropdown-header">Manage</li> 
           <li><a href="/content/admin">Manage Content</a></li> 
          <li> <a href="/admin/ListEmployers ">Manage Employers</a></li> 
          <li> <a href="/admin/listjobs ">Manage Jobs</a></li> 
       <li><a href="/admin/ManageContact">Manage Enquiry</a></li> 
       <li><a href="/admin/EmailSettings ">Manage Site Settings</a></li> 
          <li><a href="/admin/profile">Manage Admin Account</a></li> 
       <li><a href="/admin/ManageFeedback">Manage Feedback</a></li> 
          <li><a href="/admin/corporateRequests">Manage Corporate Requests</a></li> 
          <li><a href="/admin/connectionrequests">Extra Connection Requests</a></li> 
          </ul> 
         </li> 
         <li class="col-sm-3"> 
          <ul> 
           <li class="dropdown-header">Products</li> 
           <li><a href="/site/socialrecruiting">Social Recruiting</a> 
           </li> 
           <li><a href="/site/hiringcollabration">Hiring Collaboration</a> 
           </li> 
           <li><a href="/site/ats">Automatic Job Posting</a> 
           </li> 

           <li><a href="/site/careersite">Careers site Branding</a> 
           </li> 


           <li><a href="/site/EmployeeReferral">Employee Referral</a> 
           </li> 
           <li><a href="/site/analytics">Analytics</a> 
           </li> 
           <li><a href="https://stackoverflow.com/users/register">Signup</a> 
           </li> 
           <li><a href="https://stackoverflow.com/users/login">Login</a> 
           </li> 
            <li><a href="/site/Contactus">Contact Us</a> 
           </li> 
          </ul> 
         </li> 
         <li class="col-sm-3"> 
          <ul> 
           <li class="dropdown-header">More</li> 
           <li><a href="/site/TermsOfService">Terms Of Service</a> 
           </li> 
           <li><a href="/site/aboutus">Company</a> 
           </li> 

           <li class="divider"></li> 

          </ul> 
         </li> 
        </ul> 
       </li> 
      </ul> 
          <ul class="nav navbar-nav"> 
       <li class="dropdown mega-dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">My Account<span class="glyphicon glyphicon-chevron-down pull-right"></span></a> 

        <ul class="dropdown-menu mega-dropdown-menu row"> 

         <li class="col-sm-3"> 
          <ul> 
           <li class="dropdown-header">Account Management</li> 
           <li><a href="/admin/profile">Edit Profile</a></li> 
      <li><a href="/admin/logout">Log out</a></li> 
          </ul> 
         </li> 
         <!-- 
         <li class="col-sm-3"> 
          <ul> 
           <li class="dropdown-header">Jackets</li> 
           <li><a href="#">Easy to customize</a> 
           </li> 
           <li><a href="#">Glyphicons</a> 
           </li> 
           <li><a href="#">Pull Right Elements</a> 
           </li> 
           <li class="divider"></li> 
           <li class="dropdown-header">Pants</li> 
           <li><a href="#">Coloured Headers</a> 
           </li> 
           <li><a href="#">Primary Buttons & Default</a> 
           </li> 
           <li><a href="#">Calls to action</a> 
           </li> 
          </ul> 
         </li> 
         --> 
         <!-- 
         <li class="col-sm-3"> 
          <ul> 
           <li class="dropdown-header">Accessories</li> 
           <li><a href="#">Default Navbar</a> 
           </li> 
           <li><a href="#">Lovely Fonts</a> 
           </li> 
           <li><a href="#">Responsive Dropdown </a> 
           </li> 
           <li class="divider"></li> 
           <li class="dropdown-header">Newsletter</li> 
           <form class="form" role="form"> 
            <div class="form-group"> 
             <label class="sr-only" for="email">Email address</label> 
             <input type="email" class="form-control" id="email" placeholder="Enter email"> 
            </div> 
            <button type="submit" class="btn btn-primary btn-block">Sign in</button> 
           </form> 
          </ul> 
         </li> 
         --> 
        </ul> 
       </li> 
      </ul> 

       <ul class="nav navbar-nav"> 
         <li><a style="width:113px !important" href="/admin/logout">Logout</a></li> 

      </ul> 
     </div> 
     <!-- /.nav-collapse --> 
    </nav> 
</div> 

Я хватаю код из http://bootsnipp.com/snippets/featured/bootstrap-mega-menu

+0

может у создать jsfiddle? – Dhara

+0

** [Отлично работает здесь] (https://jsfiddle.net/Guruprasad_Rao/t02u0vL9/) ** –

+0

он работает для меня в моем браузере, а как же вы работаете в своем браузере? – Gintoki

ответ

0

Its работает отлично на моей стороне

<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 

-- your menu code -- 

попробовать это .. может работать

+0

Спасибо, я разрешаю, включив в свои файлы мои файлы, устаревшие от проблемы, о которой я так думаю. – rockstar

Смежные вопросы