2016-03-11 3 views
0

У меня есть код из учебника на 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"> 
+0

Вы включили загрузочные CSS-файлы, но не JS-файл. –

+0

удалите неподходящие метки - вопрос не имеет ничего общего с boostrapping, не содержит javascript или jquery – user1859022

ответ

0

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

вы включая JS файл в качестве таблицы стилей

+0

спасибо большое –

0

Без рабочего кода, я могу только догадываться.

Но я думаю, из-за этого:

data-target=".navHeaderCollapse" 

Попробуйте удалить период.

И я думаю, что navHeaderCollapse должен быть идентификатором.

+0

все еще не работает :( –

+0

Я ошибаюсь, это не идентификатор, это может быть класс. вы уверены, что все скрипты загружаются правильно? – Artvader

+0

http://plnkr.co/edit/R4wvx66ude7hdDFGz7ej – Artvader

0

попробуйте добавить

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

и .navHeaderCollapse было правильным. Не меняйте его.

0

Вы забыли бутстрапом файл: расслоение плотной

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

С помощью этой линии она должна работать.

Смежные вопросы