title: Fix menu bar at top of page once header has been scrolled past
body: <p>Firstly I apologise if this is too open-ended a question.</p>
  
  <p>I am aware of making the header of a web page static so it is always visible at the top of the viewport and the content passes beneath it as you scroll down. This can be achieved purely with css.</p>
  
  <p>I was wondering how you would achieve letting the header scroll off the page but leave a horizontal menu bar static at the top. <a href="http://www.forexfactory.com" rel="noreferrer">http://www.forexfactory.com</a> is a perfect example of this.</p>
  
  <p>I see it calls a JavaScript function <code>onHeaderComplete.execute()</code> which I assume applies extra css style to the nav bar when the header scrolls off but I'm unsure of how it works. Any basic explanation appreciated as my JavaScript skills are relatively limited.</p>