title: How Do I Get This CSS Transition Working?
body: <p>I have a CSS transition issue that doesn't appear to be working. Basically when the user scroll down a class is added to the header to set the &quot;top&quot; property to minus so it is hidden, and when the user scrolls back up the &quot;top&quot; property is set back to 0. However the transition to make it appear nice isn't working.</p>
  <p>The development site can be found here - <a href="http://polarpc.co.uk/home/" rel="nofollow noreferrer">http://polarpc.co.uk/home/</a></p>
  <p>If you inspect the header element, you'll see that I have the CSS property - transition: all 0.5s; on it.</p>
  <p>I've tried also adding it to the class nav-up and nav-down which get added/removed when you scroll up/down but the same thing happens. I just want the header to appear that it's sliding up and down rather than just disappearing. Thanks!</p>