我在这里有点迷失,主要是因为我不知道jquery但我正在尝试使用bootstraps折叠jquery插件来获得移动第一个菜单。我没有使用bootstraps css,我需要使用它吗?是否有可能只使用jquery插件而没有任何bootstraps css?当我按下三栏菜单图标时没有任何反应。我的css目前正在隐藏并显示三个栏菜单图标 - 我不知道这是否与jquery中的任何内容竞争。
<body>
<section class="grid sticky">
<div class="container">
<header class="grid twelve header">
<a href="#" class="menuButton btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<div class="iconBar"></div>
<div class="iconBar"></div>
<div class="iconBar"></div>
</a>
<div class="logoHolder">
<a class="logo" href="index.html">
<img src="img/logo/ks_logo.svg">
</a>
</div>
<!-- Main Nav, hidden below 768 px -->
<nav class="mainNav not-phone not-phoneSM">
<ul class="nav">
<li><a href="work.html">Work</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
</div>
</section>
<!-- Mobile Main Nav, called upon to relieve when screen is at 768 px -->
<section class="not-desktop not-tablet">
<header>
<nav class="mobileMainNav nav-collapse collapse">
<ul>
<li><a href="work.html">Work</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
</section>
<!-- jQuery via Google + local fallback, see h5bp.com -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<!-- Bootstrap jQuery Plugins, compiled and minified -->
<script src="bootstrap2/js/bootstrap.min.js"></script>
</body>
答案 0 :(得分:1)
Buddy在bootstrap的css文件中有Style类,dropdown js使用它们来工作。 因此,要么为它们编写自定义样式,要么使用默认样式。我在下面提到的很少:
.navbar .nav > li > .dropdown-menu:after {
}
.navbar .nav > li > .dropdown-menu:before {
}
.dropdown-menu > li > a {
}
.dropdown-menu{
}
.dropdown-toggle {
}
.dropdown{
}
将dropdown
类粘贴到您想要具有下拉切换功能的Li元素。
附加dropdown-menu
到ul
以显示下拉菜单。
示例:
<ul class="nav">
<li class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle" href="#">Hom <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another</a></li>
<li><a href="#">Some</a></li>
</ul>
</li>
</ul>
您可以完全重写这些样式并在项目中使用它们。
答案 1 :(得分:-1)
我认为你需要在最后添加
<script src="bootstrap2/js/bootstrap-dropdown.js"></script>
http://twitter.github.com/bootstrap/assets/js/bootstrap-dropdown.js
的来源