Header Fade In/Fade Out Animation While Scrolling (Dawn Theme)

jesseflores · October 24, 2023, 6:40am

I am trying to figure out how to get this animation of when scrolling down, the header background fades white and texts fade black, and when scrolled all the way back to the top, the header fades transparent and the text turns white. Is it possible to currently do this with Shopify?

The video below for example:

zaczee · October 24, 2023, 8:21am

HI,

Can you share your store url

jesseflores · October 24, 2023, 12:52pm

Hi, thank you for your response. my website is https://224d9c-2.myshopify.com/ I just started so any help is appreciated

Topic		Replies	Views
Fade In/Fade Out Animation While Scrolling Store Design design , customizations , css , shopify-themes	4	109	April 3, 2023
Dawn - Make header background turn black when scrolling down Store Design design , customizations , css , shopify-themes	3	14	March 28, 2023
On Home Page, Header should be transparent, when scroll down, should turn to normal, solid white Store Design design , header	9	67	September 3, 2023
How can I alter the header color on scroll with the Dawn Theme? Store Design	5	16	April 17, 2022
How can I make my header turn white when scrolling? Store Design	4	18	February 21, 2023

Header Fade In/Fade Out Animation While Scrolling (Dawn Theme)

Related topics