Bruno  Vincent Bruno Vincent - 7 months ago 28
Javascript Question

What code is used for dynamically shrinking navbars as you scroll down?

I have looking to duplicate this navbar for my site:

http://www.bluefountainmedia.com/

As you can see, when scrolling down, the navbar shrinks, what script is used for that?

Answer

It might be something like this:

jQuery(document).scroll(function() {      // Runs when page is scrolled
  var y = jQuery(this).scrollTop();        
  if (y > 100) {
    jQuery('nav').css('height', '80px');  // Changes after scroll distance of 100px
  } else {
    jQuery('nav').css('height', '200px'); // Reverts back when close to top
  }
});