Custom Sticky Header Transition

I am clueless on the way I can create this header. I imagine it would involved the use of jQuery or possibly can be done with pure CSS3 but, I am not sure.

Here is what I am trying to do:

http://i.imgur.com/F9RKsTs.jpg

Hi,

Here’s a very basic (old) example of a sticky header that works with a little jquery.

It uses the same html for the normal header and the sticky header but as the js adds a class to the element you can of course hide sections you don’t need and perhaps reveal new ones to create a different look.

The code is short so just copy it all and play with it but you do need jquery loaded (although I’m sure the js forum could help with a version that doesn’t need jquery).

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.