下拉菜单不适用于教程

时间:2016-03-11 09:47:43

标签: javascript jquery html twitter-bootstrap

我有一个来自youtube教程的代码。我被卡住了,因为它已经添加了它的bootstrap js和其他人,但它不起作用。请帮我 。感谢。

以下是教程下拉菜单中的代码:

<div class="navbar navbar-inverse navbar-static-top">

    <div class="container">
        <a href="#" class="navbar-brand">Site Tittle</a>

        <button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
          <span class="icon-bar"> </span>
          <span class="icon-bar"> </span>
          <span class="icon-bar"> </span>
        </button>

        <div class="collapse navbar-collapse navHeaderCollapse">

          <ul class="nav navbar-nav navbar-right">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#">Blog</a></li>
            <li class="dropdown">

              <a href="#" class="dropdown-toggle" data-toggle="dropdown">Social Media <b class="caret"></b></a>
              <ul class="dropdown-menu">
                  <li><a href="#">Twitter</a></li>
                  <li><a href="#">Facebook</a></li>
                  <li><a href="#">Google+</a></li>
                  <li><a href="#">Instagram</a></li>
              </ul>
            </li>
            <li><a href="#">About</a></li>
          </ul>
        </div>
    </div>
  </div>

这是链接:

<link href="<?php echo base_url('assets/css/bootstrap.css');?>" rel="stylesheet">
  <link href="<?php echo base_url('assets/css/bootstrap.min.css');?>" rel="stylesheet">
  <link href="<?php echo base_url('assets/css/bootstrap-theme.css');?>" rel="stylesheet">
  <link href="<?php echo base_url('assets/js/jquery.min.js');?>" rel="stylesheet">

4 个答案:

答案 0 :(得分:0)

没有正常工作的代码,我只能猜测。

但我的猜测是因为:

data-target=".navHeaderCollapse"

尝试删除期间。

我认为navHeaderCollapse应该是一个id。

答案 1 :(得分:0)

<script src="<?php echo base_url('assets/js/jquery.min.js');?>"></script>

你将js文件包含为样式表

答案 2 :(得分:0)

尝试添加

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

和.navHeaderCollapse是正确的。不要改变它。

答案 3 :(得分:0)

你忘记了bootstrap js文件:

<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

使用这条线它应该可以工作。