Аффикс Bootstrap на панели навигации, свойство всегда включено (класс всегда активен)

Я пытаюсь реализовать прикрепленную панель навигации Bootstrap, как в в этом примере.

Вот ручка того, что у меня есть. Кажется, что класс «аффикс» всегда активируется на элементе панели навигации. То есть, когда я делаю

.affix {
   top: 0;
}

Панель навигации автоматически поднимается вверх при загрузке страницы, когда я хочу, чтобы она находилась под именем и заголовком. Любые идеи о том, почему это может происходить?

РЕДАКТИРОВАТЬ: исправлен пример ссылки


javascript html css twitter-bootstrap affix
person Alex Hermstad    schedule 16.01.2017    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Что-то вроде этого?

https://codepen.io/anon/pen/mRrBNK

Я только что переместил заголовок и подтекст и добавил класс внутри

<nav class="navbar navbar-default navbar-custom" data-spy="affix" data-offset top="197">      
<div class="navbrand">
  <h1> John Smith</h1></div>
  <h4> Developer and Engineer </h4>
person Ballard    schedule 16.01.2017
comment
если вы хотите, чтобы заголовок удалялся при прокрутке, я рекомендую JQuery. - person Ballard; 16.01.2017
comment
Я имел в виду нечто большее, чем поведение в этом примере: w3schools .com/Bootstrap/ Обратите внимание, что панель навигации находится под содержимым, но при прокрутке остается вверху страницы. В основном я хочу, чтобы навигационная панель располагалась под именем и заголовком, а затем придерживалась остановки, когда она прокручивалась. - person Alex Hermstad; 16.01.2017