title: jQuery - Sticky header that shrinks when scrolling down
body: <p>I wonder how to make a sticky header shrink(with animation) when you scroll down the page and goes back to normal state when the page is scrolled up to the top. Here are two examples to clearify:</p>
  
  <p><a href="http://themenectar.com/demo/salient/">http://themenectar.com/demo/salient/</a></p>
  
  <p><a href="http://www.kriesi.at/themes/enfold/">http://www.kriesi.at/themes/enfold/</a></p>
  
  <p>I get the part to make it fixed, but how should I do to shrink my header when the user scrolls down?</p>
  
  <p>Thanks a ton</p>