title: Sticky header with a switch (like Hongkiat)
body: <p>I'm creating the sticky header using waypoints in this tutorial <a href="http://www.webtutorialplus.com/sticky-header-on-scroll-jquery/" rel="nofollow">http://www.webtutorialplus.com/sticky-header-on-scroll-jquery/</a></p>
  
  <p>But how do I create a header which 'swaps'?</p>
  
  <p>Example: If you visit <a href="http://www.hongkiat.com/blog/" rel="nofollow">http://www.hongkiat.com/blog/</a> and scroll down the header which scrolls, is not actually an element which is originally visible on the page.</p>