Skip to content

Instantly share code, notes, and snippets.

@TanvirAmi
Last active December 18, 2015 08:41
Show Gist options
  • Save TanvirAmi/63ecd6d38b701101e67c to your computer and use it in GitHub Desktop.
Save TanvirAmi/63ecd6d38b701101e67c to your computer and use it in GitHub Desktop.
Navigation will be fixed at the top position at the time of scrolling. You have to change (#custom_nav_id) with your custom nav/div id.
jQuery(function($) {
// grab the initial top offset of the navigation
var sticky_navigation_offset_top = $('#custom_nav_id').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) {
$('#custom_nav_id').css({ 'position': 'fixed', 'top':0, 'width' : 'inherit', 'z-index' : '999'});
} else {
$('#custom_nav_id').css({ 'position': 'relative' });
}
};
// run our function on load
sticky_navigation();
// and run it again every time you scroll
jQuery(window).scroll(function($) {
sticky_navigation();
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment