2013-10-08 4 views
0

Я знаю, что это кажется общей проблемой для людей, и я читал столько, сколько могу найти по этому вопросу, но я что-то пропустил. Я следовал примеру на сайте начальной загрузки в качестве шаблона, сайт реагирует и изменяет размеры, как должен. Когда он достигает точки, в которой отображается кнопка переключения, я нажимаю и ничего не происходит. Это на главной страницеbootstrap 3 nav bar toggle не отображает ничего на клике

Глава HTML:

<head runat="server"><meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" /> 
<link href="../Content/bootstrap.css" rel="stylesheet" /> 
<link href="../Content/Interior.css" rel="stylesheet" /> <!-- custom style sheet --> 
<link href="../Content/normalize.css" rel="stylesheet" /> 
</head> 

HTML:

<nav class="navbar navbar-default" role="navigation"> 
       <div class="navbar-header"> 
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="navbar-collapse"> 
         <span class="sr-only"></span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
        </button> 
        <a class="navbar-brand" href="#">Site Name</a> 
       </div> 

       <div class="navbar-collapse collapse"> 
        <ul class="nav navbar-nav"> 
         <li><a href="#">Dash</a></li> 
         <li><a href="#">Edit Profile</a></li> 
         <li><a href="#">Invite</a></li> 
         <li><a href="#">Record A Message</a></li> 
         <li> 
          <p class="navbar-text">Connections <span class="badge">0</span></p> 
         </li> 
        </ul> 
        <ul class="nav navbar-nav navbar-right"> 
         <li> 
          <p class="navbar-text">Sign out as <a class="navbar-link" href="Login.aspx">User</a></p> 
         </li> 
        </ul> 
       </div> 
      </nav> 
... 
<script src="../Scripts/jquery-2.0.3.min.js"></script> 
    <script src="../Scripts/bootstrap.js"></script> 
</body> 
</html> 

Я бы признателен за любые идеи по этому вопросу.

ответ

2

Вам просто нужно добавить период на этой линии:

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

(в конечном итоге положить это вместе, чтобы понять это: http://jsfiddle.net/VDcnr/)

Хотя я бы рекомендовал поместить пользовательский класс там для случая с нечетным углом, в результате которого вы получаете две навигационные строки на одной странице.

Кроме того, в качестве оповещения, я уверен, что normalize.css включен в bootstrap, поэтому вам не нужно включать его снова.

+1

Как только я прочитал вашу первую строчку, я знал, что я забыл. Argh. Хороший глаз. –

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