Can you recreate a similar header in pure CSS?
If you take a look at the official Google Blog at googleblog.blogspot.de/ you will notice the nice transformation of the header when you scroll down.

I am not referring to the bouncing colored balls here but to the top bar and the logo that minimize smoothly as you scroll down a bit and then stay on top only to extend again when you go back to the top.
As the whole website seems to heavily depend on javascript (it's actually blank when deactivated) it is hard to see if this is implemented in CSS or javascript.
Is something like this possible without any javascript in pure CSS? Can you give examples?