Navigation Bar - fading-in of site logo when scrolling down

I have seen this on websites and just thought it would be really cool if there was the option of having the site logo fade in, once the user starts scrolling down (with the sticky navigation bar option). My site logo is on the right.

Often times a big logo is also displayed in the banner image of a home page, for example. If one has the logo also show in the navigation bar, there are a lot of logos on one page…

Maybe there is another way of doing what I have in mind (with other tools), but I cannot figure it out.

Thanks in advance for any hint or advice.
Markus

Here’s a screenshot of what I’d like to do:

This is something that Foundry does not offer now. But, if you go to Big White Duck site there are several stacks that he has that can achieve this effect. I know Chroma works with Foundry because I have tried it out.

2 Likes

Yes BWD’s Chroma and Chroma Plus will do this and so much more and as Steve mentioned, works perfectly with Foundry. I hardly ever build a Foundry site without Chroma.

There are demos on the BWD site which are well worth getting to grip with to understand how it can be used.

3 Likes

Awesome! Thank you so much for your tips - @Steve_J and @webdeersign!

Chroma Plus looks amazing. And Andrew, its developer, is great too - he already got back to me with detailed instructions on how to achieve what I am after!

1 Like

Andrew really is a great guy. He was probably sat in a meeting or in a train or space ship when he took the time to reply to you with his detailed instructions for what is essentialy a “free” stack. Top bloke.

4 Likes

Andrew’s help was very much appreciated, since having the logo fade in was not a simple menu option. I would not have been able to figure that one out on my own.

But it seems that there is little Chroma Pro can not do. A few custom user style entries that define the opacity of the branding logo did the trick. It works beautifully now.

Yes, the stacks from BWD are great, but it takes a learning curve. I hope to see more stacks from Adam which give us more options to play with movement/ animations/ layers but not as complicated as BWD :slight_smile:

2 Likes