sticky nav

$(window).scroll(function () { var navPos = $('.header-wrapper').outerHeight(); /* ^^ Sticky Navigation Starting Position, navPos, is equal to the height of the element above it. OuterHeight gives us the padding and margin and everything */ if ($(window).scrollTop() <= navPos){ $('.navbar').removeClass('navbar-fixed-top'); } /* ^^ If the scroll position is less than or equal to the Nav Starting Position, remove the 'navbar-fixed-top' class from the element with the classname "navbar". */ if ($(window).scrollTop() > navPos) { $('.navbar').addClass('navbar-fixed-top'); } /*^^ If the scroll position is greater than the height of the starting nav position, the nav bar has reached the top of the screen, so add the class 'navbar-fixed-top'*/ });