Foundation Framework Sticky Topbar не липкий

Question

Я использую фреймворк Foundation, и я хочу, чтобы компонент «верхняя панель» был липким, когда окно браузера касается навигации. В документации показан пример с именем "Stick Top Bar".

Теперь у меня есть построить что Topbar так же, как документации показывает, но это не распространяется работа ...

Вот link на страницу.

Любой может видеть, где я терпит неудачу?

Answer 1

Если вы хотите, чтобы ваш верхний стержень был на верху и пал туда, вам нужен position: fixed;. Тогда ваш сверху, слева, справа и снизу атрибуты будут работать, и вы будете в состоянии поставить Navbar на вершину, добавляя top:0;

.sticky { 
     top: 0; 
     position: fixed; 
    } 

Добавить JavaScript (если у вас есть JQuery включен)

$(window).scroll(function() { 
    var $this = $(this), 
     $head = $('.navigation'); 
    if ($this.scrollTop() > 1000) { 
     $head.addClass('sticky'); 
    } else { 
     $head.removeClass('sticky'); 
    } 
}); 

Вы можете отрегулировать положение, при котором бар всплывает с $this.scrollTop() > yourvaluehere

JSFiddle