Transition on Shrink not smooth

Hi, I looked at that page and there are a few odd things going on. Sticky sections inside of sticky sections that each have different transition durations.
Can you please email me [email protected] so I can help you further. Email will make it easier to send photos and things like to help you. Thanks

Hi Robert, can you tell me what the answer was on this issue? My menu jumps to the reduced size sticky menu, but ‘ease’s’ when scrolling to top to show the original menu. I am building on localhost so can’t provide access, so I thought you may have the answer from the above question.

Thanks in advance
Paul

Looks like the following is missing from the css, regardless of base theme used. Any ideas why the transition effect could be missing?:

.she-header {
transition: all 0.4s ease-in-out;
}

When I manually add is, it shrinks and expands with ‘ease’ ???

@chopper72 that issue was that the image wasn’t easing and the section was. It was solved by removing the custom image size and using the default 300×300 setting.
Your situation sounds like it could be a CSS minifying issue. Every WordPress install is different so it’s hard to say what it might be.
I’ve had to duplicate elementor objects lately to get them to work right for me. This might be a temporary elementor bug, I’m not sure.
It seems like you found the solution though. Is that working ok for you?

• This reply was modified 5 years, 8 months ago by Robert Wattner.

Hi Robert, I have loaded it to me test server so that you can see what I mean about the lack of ‘transition easing’ when scrolling to reveal the sticky menu.
Yes, If I add the missing css below, it ease’s both in and out of the sticky menu.
However, any ideas why it is missing? I only have Elementor Pro and your sticky plugin installed on a clean install.

https://wordpress-224129-900747.cloudwaysapps.com/homepage-v1/

Thanks
Paul

@chopper72 Thanks, I will be on my computer in just a minute and I’ll take a look.

Can you please email me [email protected] it’s much easier to send files etc… Thanks

• This reply was modified 5 years, 8 months ago by Robert Wattner.

Cool. Just for your reference, NORMAL header state has:

.she-header-transparent-yes {
position: fixed;
background-color: rbga(0,0,0,0) !important;
z-index: 99;
width: 100%;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}

STICKY has:

.she-header {
background-color: rgba(255, 255, 255, 0.5);
z-index: 99;
width: 100%;
margin-top: 0;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
position: fixed;
top: 0;
}

Which appears to be missing the ‘transition’ element:
transition: all 0.4s ease-in-out;

Hope that helps.

If you want, I have login details for you to take a better look if you prefer?

I’m sorry, I can’t ask for your login details…forum rules. [email protected]

Ok, I found the issue. For some reason the transition is actually missing from the plugin CSS files. I will add the missing code and update the plugin. I have no idea why it’s missing because it used to be there. Thanks for your help finding this. I will let you know when the update is live. Thanks again

Boom! Excellent and glad that I could help ??

Bam! You’re the man! The update will be up soon, need to test first.

@chopper72 The update 1.3.2 with the added CSS is live. Thanks again for your help and let me know if this fixes your issue

Great. My custom css removed. All working as expected. Thanks!!!