Bootstrap 3 Navbar在移动设备上不起作用 [英] Bootstrap 3 Navbar not working on mobile
本文介绍了Bootstrap 3 Navbar在移动设备上不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我的Bootstrap Navbar在手机视图上不起作用(当它无法显示链接时).我无法单击该按钮.在对Internet和StackOverflow进行了大量研究之后,我尝试了该解决方案,但没有人起作用.这些是我尝试过的解决方案;
My Bootstrap Navbar isn't working on mobile phone view (when it can't display the links). I can't click the button. After many research on Internet and StackOverflow, I tried out the solution and no one works. These are the solutions that I tried;
- 验证
数据目标
和id
.如此处 检查 - 添加
<元名称=视图端口" content ="width = device-width,initial-scale = 1.0">
- Verify the
data-target
andid
. As here Check - Add the
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Here Check - Add CSS
.dropdown-backdrop { position: static; }
On Stack, somewhere
这是我的导航栏代码;
Here is my navbar code;
<nav id="layout-nav" class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navigationbar">
<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="index.php">7 Frères</a>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse" id="navigationbar">
<ul class="nav navbar-nav">
{% for item in staticMenu.menuItems %}
<li class="{% if item.isActive %}active{% endif %}"><a href="{{ item.url }}">{{ item.title }}</a></li>
{% endfor %}
</li>
</ul>
</div>
</div>
</nav>
谢谢!
推荐答案
问题是您的页面上没有包含Bootstrap Javascript(使用内置下拉菜单是必需的).一旦包含了它,它应该可以工作:
The issue is that you are not including the Bootstrap Javascript(necessary for using the built-in dropdown menu) on your page. Once you have included that, it should work:
<script tpye="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
这篇关于Bootstrap 3 Navbar在移动设备上不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文