Bootstrap 3 с использованием аффикса для фиксации положения навигатора сверху при прокрутке

Это сводит меня с ума... Это может быть просто, потому что я не нажимаю гвоздь: пожалуйста, дайте подсказку: -)

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

Я получил его работу, но содержимое ниже navbar сдвигается, когда класс аффикса запускается. Я не могу найти способ обойти его.

ОТВЕТЫ

Ответ 1

Есть два варианта: javascript или HTML5 data- attribute

Через атрибуты данных Чтобы легко добавить поведение аффикса к любому элементу, просто добавьте data-spy = "affix" в элемент, который вы хотите отслеживать. Используйте смещения, чтобы определить, когда переключать пиннинг элемента.

<div data-spy="affix" data-offset-top="60" data-offset-bottom="200">
  ...
</div>

Через JavaScript Вызовите плагин аффикса через JavaScript:

  $('#my-affix').affix({
    offset: {
      top: 100
    , bottom: function () {
        return (this.bottom = $('.footer').outerHeight(true))
      }
    }
  })

DEMO http://jsfiddle.net/6P5sF/56/

ссылка http://getbootstrap.com/javascript/#affix-examples