For my next web design I want to do something cool, like a header effect on scroll. An example of what I want to achieve is something like this: Chris Simpson web page, so I looked for a tutorial to get some ideas to do it: How to Create a “Stay-On-Top” Menu with CSS3 and jQuery.

For my website I will use the effect of hiding the nav bar on scrolling until the header image disappears and then, fix the nav bar on top of the page. For this, 2 classes will be used, ‘default’ and ‘fixed’ and I will change one to another when the scroll reaches the header height. You can see the result in Centro de Ayuda Adolescentes.