Кнопка Navbar Collapse не будет расширяться

Итак, я только начал работать над моей страницей портфолио (второй проект так нежный), и все прошло гладко, пока я не попытался использовать кнопку свернуть, чтобы показать ссылки на другие части моей веб-страницы.Кнопка Navbar Collapse не будет расширяться

Вот код в вопросе:

<body> 
<div class="row"> 
<div class="col-md-12"> 
    <div class="container"> 
    <nav class="navbar navbar-inverse navbar-fixed-top"> 
     <a href="#" class="navbar-brand Logo" id="Logo"> 
     StruckCroissant 
    </a> 
     <button class="navbar-toggle" type="button" 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" id="Nav-List"> 
      <li><a href="#">About Me</a></li> 
      <li><a href="#">Projects</a></li> 
      <li><a href="#">Contact Me</a></li> 
     </ul> 
     </div> 
    </nav> 
    </div> 
</div>

И тогда здесь обычай CSS я использую:

.Logo{ 
 
    font-size:20px; 
 
    color:white; 
 
    font-family:Monospace; 
 
    -webkit-transition:all ease 0.2s; 
 
    -moz-transition:all ease 0.2s; 
 
    -o-transition:all ease 0.2s; 
 
    transition:all ease 0.2s; 
 
} 
 

 
#Logo:hover{ 
 
    font-size:20px; 
 
    color:green; 
 
    font-family:Monospace; 
 
    background-color:white; 
 
    border-color:white 
 
} 
 

 
#Nav-List{ 
 
    padding-right:30px; 
 
}

В основном моя проблема получает n для расширения и фактического отображения элементов в списке, но в настоящее время все, что он делает, просто реагирует на щелчок, становясь более ярким.

Любая помощь приветствуется! Заранее спасибо!

источник

2016-08-26 StruckCroissant

У меня была аналогичная проблема. Просмотрел html несколько раз и был уверен, что это правильно. Затем я начал играть с порядком jquery и javascript.

Первоначально у меня была загрузка bootstrap.min.js ПЕРЕД jQuery.min.js. В этом состоянии меню не будет расширяться при нажатии на значок меню.

Затем я изменил порядок, чтобы bootstrap.min.js появился после jquery.min.js, и это решило проблему. Я не знаю достаточно о javascript, чтобы объяснить, почему это вызвало проблему (или исправило ее), но это то, что сработало для меня.

Дополнительная информация:

Оба сценария расположены в нижней части страницы, непосредственно перед тегом. Оба сценария размещаются на CDN, а не локально.

Если вы уверены, что ваш код верен, попробуйте это.

Если это не поможет решить проблему, выполните следующие действия:

1 - Опубликовать Вашу Plunker или скрипку здесь
2 - Попробуйте использовать этот фрагмент код для образца Navbar коллапса вместо вашего, с вашим собственным стиль

<div class="collapse navbar-collapse"> 
       <ul class="nav navbar-nav navbar-right"> 
       <button id="loginbutton" type="button" class="btn btn-primary narbar-btn"><i class="glyphicon glyphicon-log-in"></i>Login</button> 
       <button type="button" class="btn btn-success navbar-btn"><i class="glyphicon glyphicon-link"></i><a href="./register.jsp">Create account</a></button> 
       </ul> 
</div>

источник

2016-08-26 20:00:12

Кнопка Navbar Collapse не будет расширяться

ответ

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