Make centered logo scroll into fixed header

[flightbulb]

My splash page has a centered logo. As you scroll down, the logo needs to scale down in size and fit into a fixed header on the top nav bar. I would like tips on how to do this.
Thanks!

[Beverleyh]

You’d need JavaScript; probably using an eventListener to “watch” for when the logo scrolls to a desirable position, at which point new CSS comes in to play to alter its size and final placement in the layout.

Googling terms like ” scroll to position JavaScript” or “scroll in to view JavaScript” will give you places to start your research. And here’s a blog post of mine from a few months ago that may help too http://blog.fofwebdesign.co.uk/41-add-classes-to-an-element-when-scrolled-into-viewport Demos are included.

[Author]

Posts