Sticky menu

by Roberto Apasajja

HTML

yay<br>yay<br>yay<br>yay<br>yay<br>yay<br>yay

<div id="navWrap">
    <nav>jkjkkjkkh</nav>
</div>

yay<br>yay<br>yay<br>yay<br>yay<br>yay<br>yay

CSS

body {
    height:1600px;
    margin:0;
}
#navWrap {
    height:70px
}
nav {
    height: 70px;
    background:gray;
    width:100%
}
.sticky {
    position: fixed;
    top:0;
}

JavaScript

$(document).scroll(function () {
    //stick nav to top of page
    var y = $(this).scrollTop();
    var navWrap = $('#navWrap').offset().top;
    if (y > navWrap) {
        $('nav').addClass('sticky');
    } else {
        $('nav').removeClass('sticky');
    }
});