Sticky navigation
// grab the initial top offset of the navigation
var stickyNavTop = $("nav.menuMain").offset().top;
var timer;
// our function that decides weather the navigation bar should have "fixed" css position or not.
var stickyNav = function() {
var scrollTop = $(window).scrollTop(); // our current vertical position from the top
// if we've scrolled more than the navigation, change its position to fixed to stick to top,
// otherwise change it back to relative
if (scrollTop > stickyNavTop) {
$("header.pageHeader").addClass("sticky");
} else {
$("header.pageHeader").removeClass("sticky");
}
};
stickyNav();
// and run it again every time you scroll
$(window).scroll(function() {
clearTimeout(timer);
timer = setTimeout(function() {
stickyNav();
}, 100);
});
.menuMain.sticky {
position: fixed;
left: 0;
top: 0;
z-index: 100;
}