Text span not showing up on load

Hi Webflow Community,

Disclaimer - I’m definitely a noob to website building and a noob to Webflow, so please forgive my ignorance.

Anyhow, I’m almost complete with building my landing page, however, there is still one thing that I cannot seem to make work. What is happening is that, once the page loads you can see my logo, LISTIN, and below is a span text with the company’s purpose. What’s weird is that when the page loads the span text doesn’t show up until I scroll up the page a few percentages. There is a trigger to move the Logo and span text up to a sticky nav bar, and the span text’s opacity goes from 100% to 0% when reaching the top. I’m thinking the problem is there in the trigger animation, but yet no luck fixing it. Also, this is happening in both mobile and desktop versions, but I do have two separate divs for each with similar animation.

If anyone can help, suggest something, that would much better than all the things I’ve been trying. And thank you for taking some time to help out.

Thanks!

Alex


Here is my public share link: https://listin-aed3ba.webflow.io/

Here is my read only link: https://preview.webflow.com/preview/listin-aed3ba?utm_medium=preview_link&utm_source=designer&utm_content=listin-aed3ba&preview=d33a4a4b9bd88e25b0d0c5fd6ecd461b&mode=preview

@Listin.fm please share your read only link

@guoshuzhang, it was in my post but was not showing up. I’ve updated my post with the read only link. Thanks.

@Listin.fm in desktop this problem

@guoshuzhang, yes this span text is supposed to go from 100% to 0% opacity as you scroll down the page, which is why the opacity at 90% down the page is set to 0%. The issue is once the page loads the span text doesn’t show up until you start scrolling.

I found the error! Definitely there, it’s because both triggers for mobile and desktop was using the same class name, when I made those independent from one another it fixed it! :slight_smile:

1 Like