title: changing an elements css position after scrolling down the page
body: <p>I am messing around with some jquery trying to get to grips with it.</p>
  
  <p>I have a ul nav which has a absolute position set but after I scroll the page down by 200 pixels i would like that to switch to position fixed so that the nav always stays on the page.</p>
  
  <p>How would I do this?</p>
  
  <p>below is the example I am working on</p>
  
  <p><a href="http://satbulsara.com/tests/" rel="noreferrer">http://satbulsara.com/tests/</a></p>