title: How to avoid content jump by add fixed?
body: <p>I created a sticky header on scroll. The only problem is that when I scroll down for <code>1000px</code>, the class <code>sticky</code> is added to the header and after that, there is a little jump of the content at the same moment when the class <code>sticky</code> is added to the header. I think this becomes, because header doesn't exists anymore on that place in the markup visually.</p>
  
  <p>I tried to add a specific height to the header. Also wrap a div around <code>container</code>, so the <code>sub-header</code> stays on that place, but with no success. 
  How should I fix this?</p>
  
  <p>Live code: <a href="http://codepen.io/anon/pen/qbaQvL?editors=110" rel="nofollow">http://codepen.io/anon/pen/qbaQvL?editors=110</a></p>