Help with flickering/jumpy scroll into view interactions

Design help Animations & Interactions
1

Hi All,
New to Webflow, so I apologize for the dumb question. I’ve searched for something similar but did not see anything.

I’ve started a site for people to buy Foosball lessons from the number #1 ranked player in the world and the #2 player in the US. But I am having a problem that I hope someone can help me with. For some reason my interaction when scrolling into view is super jumpy and flickery (is flickery a word?). I turned up smoothing and it doesn’t seem to help. The flickering doesn’t happen in live preview, but only when I click the eyeball view. Can anyone help me, please?

https://preview.webflow.com/preview/foos-by-v2?utm_medium=preview_link&utm_source=designer&utm_content=foos-by-v2&preview=93c7a422e2f268c819b9d5919f8cb608&mode=preview

Thank you in advance
Jacob

Here is my public share link: LINK
(how to access public share link)

2

Not a dumb question at all! This looks to be caused because you’re applying a “While scrolling in view” to multiple elements within that section—however this is intended to be applied to a single container element and have that animation target each of your internal elements as needed.

Ex: While (your section) is scrolling in view, animate (player image), (headline text), and (paragraph text)

2 Likes
3

and I would like to add that you should probably consider using offsets, since non of the elements are starting the animation from fully off screen…

2 Likes
4

Awesome! Thank you both I’ll try to fix them tonight!!!