Change when header sticky

How To
1

I moved to Bricks from Divi a few months back and I’m so happy, but I miss one function.

Divi has an option on CSS values such as sizes, colours, paddings etc that can change if the header is sticky from the scroll.

For example, when the user scrolls the navigation header sticks to the top (which is easily done in Bricks) but with Divi I can tell anything on the page anywhere to do X when the header is sticky and return to the original value when not sticky.

It’s similar to the states function, currently Bricks has Focus, Active, Hover and this will use different values if those are true, what Divi has is Sticky.

Can this be achieve with Bricks? If so, how?

2

there is no setting for that specific case but with interactions you can build any type of check, trigger and interactions you want.

when sticky is enabled it adds class to header.
just check that with interactions or create a state for it and do whatever you want with it.
so many ways to solve this with bricks
image

1 Like
3

I’ve set a given brxe-section which contains the h1 together with a couple of buttons as sticky.

However, once Sticky I would love to decrease the row gaps for mobile.

I’ve check Bricks, and it doesn’t sets an “on-scroll” class to any other element other than the header.

What would be the propper workaround to change when sticky is other than header?