Skip to content

Instantly share code, notes, and snippets.

@mustafix
Last active January 11, 2017 12:43
Show Gist options
  • Save mustafix/72109e2af2df2a65810bfcfb2b2a4e2d to your computer and use it in GitHub Desktop.
Save mustafix/72109e2af2df2a65810bfcfb2b2a4e2d to your computer and use it in GitHub Desktop.
--------------------------------------------------------------
jQuery Script
--------------------------------------------------------------
jQuery(document).ready(function(){
// grab the initial top offset of the navigation
var sticky_navigation_offset_top = $('on your div id/class ').offset().top;
// our function that decides weather the navigation bar should have "fixed" css position or not.
var sticky_navigation = function(){
var scroll_top = $(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 (scroll_top > sticky_navigation_offset_top) {
$('on your div id/class').css({ 'position': 'fixed', 'top':0, 'left':0 });
} else {
$('on your div id/class').css({ 'position': 'relative' });
}
};
// run our function on load
sticky_navigation();
// and run it again every time you scroll
jQuery(window).scroll(function() {
sticky_navigation();
});
});
--------------------------------------------------------------
CSS
--------------------------------------------------------------
id/class {
position: relative;
width: 100%;
z-index: 99999999;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment