Elementor Sticky Header

This topic contains 2 replies, has 3 voices, and was last updated by  Sebastian 2 weeks, 6 days ago.

Author Posts

Lincsdigital

Hi Sebastian

I am creating a sticky header with elementor, but cannot do everything in elementor, change text colour on scroll.

Is this something I can do with microthemer? If so could you advice on it?

This is the code I have already put into custom CSS panel.

selector.elementor-sticky–effects{
background-color: rgba(255,255,255,1)!important }

selector{
transition: background-color 1s ease !important; }

selector.elementor-sticky–effects >.elementor-container{
min-height: 80px;
}

selector > .elementor-container{
transition: min-height 0.5s ease !important; }

Please let me know if you need more information.

Any advice would be great.

Thanks

Pete


jjjas

I am also curious. Thanks for bringing this up!


Sebastian

@lincsdigital – I’m so sorry for not replying, I somehow missed your message back in April. I never deliberately ignore support requests.

@jjjas, thanks for reviving this!

@lincsdigital perhaps this issue has been solved already, but if not, can I just check that you are using the word “selector” above as a way of describing the code to me, rather than the code actually container the word selector? If it really does container selector, that might be the source of the problem.

So this:

selector.elementor-sticky–effects{
background-color: rgba(255,255,255,1)!important }

Would actually be:

.some-real-class.elementor-sticky–effects{
background-color: rgba(255,255,255,1)!important }

If this issue is still active, please could you send me a link to the page where you tried to transition the background -color and height? The code looks like it should work if the selector is correct, but I can only tell so much from looking at code by itself.

Thanks,
Sebastian

You must login or register to reply to this topic.