2013-11-24 5 views
0

Я знаю, что есть что-то простое, что мне не хватает, но когда я сжимаю свой экран, переключатель переключения руля не работает. Я уже ищу SO, и я не могу найти решение, которое исправляет мои проблемы.Bootstrap 3 Navbar не рушится

Может кто-нибудь помочь мне выяснить, чего мне не хватает в коде ниже?

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <meta http-equiv="Content-Style-Type" content="text/css"> 
    <title></title> 
    <link rel="stylesheet" href="css/bootstrap.min.css" /> 
    <link rel="stylesheet" href="css/slate-bootstrap.min.css" /> 
    <link rel="stylesheet" href="css/larry.css" /> 
</head> 
<body> 
<div id="page"> 
    <header class="container"> 
    <div id="menu" class="navbar navbar-default"> 
     <div class="navbar-header"> 
      <button class="btn btn-success navbar-toggle" 
        data-toggle="collapse" 
        data-target=".navbar-collapse"><span class="glyphicon glyphicon-chevron-down"></span> 
      </button> 
      <div id="logo"> 
       <h4><a href='./index.html'><img src="images/LE-logo.png"></a></h4> 
      </div> 
     </div> 

     <div class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav navbar-right"> 
       <li class="nav active"><a href="./index.html">Home</a></li> 
       <li class="nav"><a href="./resume.html">Resume</a></li> 
       <li class="nav"><a href="./contact.html">Contact</a></li> 
       <li class="nav"><a href="./about.html">About</a></li> 
      </ul> 
     </div> 
    </div> 
    </header> 

    <section id="body" class="container"> 
    <section id="main" class="col-md-9"> 
     <p> Ipsome loreme, blah , blah</p> 

    </section> 
    </section> 


    <hr /> 
    <footer class="container"> 
    <p>Placeholder for footer</p> 
    </footer> 
</div> 

<script scr="js/jquery-2.0.3.min.js"></script> 
<script scr="js/bootstrap.min.js"></script> 

</body> 
</html> 
+0

Появляется глификон, но это не значит, что вы не переключаете divbar-collapse div. –

+1

Что у вас уже работает отлично http://jsfiddle.net/NkED8/ – rwisch45

+0

Спасибо @ rwisch45. Это должна быть проблема с браузером, или по какой-то причине jquery не загружается. Спасибо что подметил это. Я буду продолжать работать над этим. –

ответ

0

После отладки в Firebug (определенно лучший инструмент для отладки браузера там) я обнаружил, что загрузка bootstrap.js не была выполнена правильно. Я не уверен, почему он не собирал его из моего каталога, но я перешел на CDN, и мне пришлось иметь «http: //» впереди.

0

Кажется, это нормально. Если элемент navbar-collapse никогда не показывался, проверьте, добавили ли вы какой-либо стиль для него, как вы его спрятали?

+0

Это часть структуры Bootstrap из того, что я понимаю. Вы просто добавляете определенные имена классов в div, затем подключаете к ним данные и объекты данных, и они должны обрабатывать это для вас. –

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