Column fade effect triggers too late

I am having an issue where a button that is in view on page load is not showing because the animation is not triggered but if you scroll down then up everything looks fine (shown in images below). I read through this post from a year ago saying that it was going to be added to the list so just wondering if there is an update on this or solution to the problem yet? Thanks.

Before scroll:

After scroll (should be like this on load):

Hi,

Regretfully there is no update for this feature yet. I will follow up and cast another for this.
For the mean time, you need to disable animation if you want your button to show up on page load.

Thank you!

Is there a way that I can disable the animation depending on the screen height so that I can still keep it for screen sizes that still show it. It’s for sizes from a laptop to an iPad that’s not working. Thanks.

Hi There,

To disable the animation for specific screen sizes, please add this custom CSS under Theme Options > CSS:

@media (min-width: 768px) and (max-width: 1024px){
    .x-column[data-fade="1"], .x-column[data-fade="true"] {
        opacity: 1 !important;
        transition-property: none !important;
    }
}

Hope it helps :slight_smile:

1 Like

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