Header builder change background on scroll

[amanjaura]

Hello I am using header builder and. using sticky header, I need to change the background of the header on scroll only. Just wondering if there is any option on how to do that other than custom css.

[tristup]

Hi @amanjaura,

Thanks for reaching out.
You can achieve that by creating two different header bars with similar structures and different backgrounds. Please follow the below steps.

1. Set Off the Sticky Bar for the header. [ Screenshot 1] and set the color in the background
2. Duplicate the same Header bar with Sticky Bar On. [ Screenshot 2 ] and set a different color in the background
3. Set Hidden initially, so it will appear only when you scroll.

Remember that the above solution is only possible if you are using Pro Header Builder.

Hope it helps.
Thanks

[amanjaura]

Awesome, thanks! worked like a charm

[tristup]

Hi @amanjaura,

Glad that we are able to help you.

Thanks

[ruenel]

Hey Amanjaura,

Your post has been withdrawn. You must have resolved your issue already.
If you need anything else we can help you with, don’t hesitate to open another thread.

Cheers.