我正在使用 bootstrap,它是一个单页网站。当我需要为移动设备使用切换时。折叠有效,但是当我单击其中一个菜单时我需要展开。
只需要它来交付元素。
有什么想法吗?
http://www.neevasoft.com/docasnovo
html
<header id="header" class="navbar-fixed-top main-nav" role="banner">
<div class="container">
<div class="row">
<div class="col-md-12">
<!-- Logo start -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".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="#home">
<img class="img-responsive" src="images\logo.png" alt="logo">
</a>
</div><!--/ Logo end -->
<nav class="collapse navbar-collapse clearfix" >
<ul class="nav navbar-nav navbar-right">
<li><a class="page-scroll" href="#home">Home</a></li>
<li><a class="page-scroll" href="#services">A Empresa</a></li>
<li><a class="page-scroll" href="#historia">História</a></li>
<li><a class="page-scroll" href="#about">Participações</a></li>
<li><a class="page-scroll" href="#team">Renovada</a></li>
<li><a class="page-scroll" href="#contact">Contato</a></li>
<li><a class="page-scroll" href="acervo.html" onClick="window.location='acervo.html'">Acervo</a></li>
<!--li><a class="page-scroll" href="#contact">Contact</a></li-->
</ul>
</nav><!--/ Navigation end -->
</div><!--/ Col end -->
</div><!--/ Row end -->
</div><!--/ Container end -->
</header><!--/ Header end -->
最佳答案
您可以简单地向每个 li 添加以下属性:
<li data-toggle="collapse" data-target=".navbar-collapse">
<a class="page-scroll" href="#home">Home</a>
</li>
....
....
这里不需要 JavaScript 代码。因为 Bootstrap 会处理它。
关于javascript - 单页网站上的 Bootstrap 切换菜单在单击时不会展开,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36405991/