0
基本上我的网站一起使用Fullpage.js和Bootstrap，但问题是为移动设备设计的菜单按钮不会折叠。当我从页面中删除Fulpage.js的所有设置时，它工作正常！为什么移动设备的Bootstrap导航菜单按钮不会折叠
这是我的site，所以你可以测试它，并尽量减少网站sm，然后你会注意到，导航栏按钮不会崩溃。
所以如果你有关于解决这个问题，这或任何解决方案的任何想法，只是让我知道...
这里是我的index.php的fullcode：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="author" content="Alvaro Trigo Lopez" />
<meta name="description" content="fullPage fixed header and footer." />
<meta name="keywords" content="fullpage,jquery,demo,screen,fixed, header,footer, absolute, positioned,css" />
<meta name="Resource-type" content="Document" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Gooyanet</title>
<link href="css/bootstrap.css" type="text/css" rel="stylesheet"/>
<link href="examples.css" type="text/css" rel="stylesheet"/>
<link href="style.css" type="text/css" rel="stylesheet"/>
<link href="jquery.fullPage.css" type="text/css" rel="stylesheet"/>
<link href="examples.css" type="text/css" rel="stylesheet"/>
<link href="jquery.fullPage.css" type="text/css" rel="stylesheet"/>
<style>
h1{
font-size: 5em;
font-family: arial,helvetica;
color: #fff;
margin:0;
padding:0;
}
.intro p{
color: #fff;
}
.section{
text-align:center;
}
#header, #footer{
position:fixed;
height: 50px;
display:block;
width: 100%;
z-index:9;
text-align:center;
color: #f2f2f2;
padding: 20px 0 0 0;
}
#header{
top:0px;
}
#footer{
bottom:0px;
}
#infoMenu {
bottom: 80px;
}
#infoMenu li a {
color: #fff;
z-index: 999;
}
</style>
<!--[if IE]>
<script type="text/javascript">
var console = { log: function() {} };
</script>
<![endif]-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="vendors/jquery.slimscroll.min.js" type="text/javascript"></script>
<script src="vendors/jquery.easings.min.js"></script>
<script src="examples.js" type="text/javascript"></script>
<script src="vendors/jquery.slimscroll.min.js" type="text/javascript"></script>
<script src="jquery.fullPage.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script src="vendors/scrolloverflow.js" type="text/javascript"></script>
<script src="jquery.fullPage.js" type="text/javascript"></script>
<script src="examples.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#fullpage').fullpage({
anchors: ['firstPage', 'secondPage', '3rdPage'],
sectionsColor: ['#C63D0F', '#1BBC9B', '#7E8F7C'],
css3: true
});
});
</script>
</head>
<body>
<div id="header">
<nav class="navbar navbar-default navbar-fixed-top BKoodakBold" id="topMenu">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<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="http://www.gooyanet.com">Gooyanet</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li ><a href="mobile.php">دانلود اپلیکیشن <span class="glyphicon glyphicon-download-alt"></span></a></li>
<li><a href="guides.php">راهنمای سایت <span class="glyphicon glyphicon-oil"></span></a></li>
<li><a href="aboutus.php">درباره ما <span class="glyphicon glyphicon-equalizer"></span></a></li>
<li><a href="login.php">ورود به دنیای گویانت <span class="glyphicon glyphicon-user"></span></a></li>
<li><a href="signup.php">ثبت نام در گویانت <span class="glyphicon glyphicon-registration-mark"></span></a></li>
</ul>
</div>
</div>
</nav>
</div>
<div id="footer">
<footer class="footer">
<div class="container">
<p class="text-muted">Designed & Developed By <a href="http://www.daygostar.com">Daygostar Inc</a></p>
</div>
</footer>
</div>
<div id="fullpage">
<div class="section">
<iframe src="Round.html" frameborder="0" scrolling="no" style="width:100%;height:100% !important;"></iframe>
</div>
</div>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
而这里的打印屏幕像你能理解我说的是哪个按钮：
