Section Fade in very (too) late


There’s been a few threads about this (and similar) topics relating to animations appearing late/too late on scroll. Or, the inability to control where it happens. I can see this was flagged up for development in December 2017,

We’re trying to get Sections to appear earlier when scrolling - at the moment, they appear roughly when 50% down the page or when much of the element is visible. This leads to a (very) large blank screen waiting for content to appear.

Is there a work-around/method/fix for this beyond the increasingly more-common response of ‘beyond the scope of our support’/ we can offer paid development / we will add this request to our features?

Hi @stuartmurphy,

Thanks for reaching out.
It seems that you are referring to the Animation on Scroll and the section will appear while scrolling down, which can be achieved using the Effect Module. I would suggest you go through the following article on this, especially the Scroll section.

Hope it helps.

Hi @tristup

Thanks for the quick reply. I’ve re-read the documents and had a thought. So I placed negative values in the offset boxes (eg -30%) for top./bottom and it works in Safari so that the animated fade in happens as the Section enters the viewport.

Problem is that working between Chrome and Safari I can see that the effect happens as designed in Chrome, whereas in Safari, you have to offset the effect so you don’t get half the viewport empty before the effect comes in. This may not be an issue if you scroll like Usain Bolt on a 100m track, however if you scroll very slowly, it looks like there is no content (in safari). It leaves me thinking there’s a choice - no effect in chrome (already happened before you reach the viewport), half empty page (safari) or offset and delay (poor user experience yet can work around the desired effect at the expense of functionality.

I’ve just played around by dragging the browser screen wider and hard resetting the browser cache (safari) and it seems to depend on multiple factors, where or how the effect happens - full-width browser - higher up the viewport, narrower browser (without going past breakpoints) effect happens as it is supposed to.

Is this a known issue? Is there a fix or temporary fix? Or is it just a case of having to do something else to get it to work?

Hello @stuartmurphy,

Can you please provide us the URL of your page where we can find the Section with the scroll effect? We need to check it and find out that maybe the delay is what is causing the issue. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
- Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.