Animation not working on mobile

I have a scroll animation that won’t work on mobile. It stays stuck on the initial state and never animates. I’m really confused as to why it’s not working. I have the same exact animation higher on the page and it works fine. Been trying everything and I can’t seem to get it to work.

It’s the spoon and red banner on the bottom.

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

Hey @Gmar07 , the reason why the interaction is not working on mobile breakpoints is because you chose the spoon-div as the interaction trigger and on small devices, since it is moved -200px, it is moved off-screen and therefore is never triggered.

The fix is simply changing the target of your interaction to break-2-container and set your banner-left-scroll animation as such:

Notice how I changed the spoon-div to Affect Class and not Affect Interaction Trigger

Your Navigator should look as such:
Screen Shot 2021-08-05 at 2.06.20 PM

1 Like

Thank you! I’m still getting the hang of Webflow so thanks for teaching me that.

Of course, we all start somewhere. I hope I was able to help you, happy designing! :grin: :+1:

1 Like