My beautiful scroll animation is not working on live mobile site ! Wix studio HELP!

[PixieG]

Hi,

I have an scroll animation which I designed in my wix studio site, where the containers in the shape of cards slide into a stack when the user scrolls. This works perfectly fine on desktop, and in the mobile testing site on desktop, and even when I load the live site and compress my browsers dimensions to a mobile breakpoint. However, when I actually load the site on my phone, the animation does not work at all. I’ve tried it on a couple of different phones as well.

My phone is not set to ‘reduce motion’.

I am stumped and getting nervous about this section because I need to be able to present it in a few days. Please someone help!

This is the live site (ignore the rest of the design and just focus on this one section please)

Home | My Site 3

Here are the screenshots -

Live site on desktop (works fine)

Live site on desktop viewed in the dimensions of a mobile screen (works fine)

Live site loaded on an actual mobile … (all the cards disappeared!!)

Help!!!

[PixieG]

Someone please help me with this issue !!

[ZACHARY_KNIGHT]

For anyone finding this post very late as I have, the primary issue with Wix Studio animations not working on mobile (esp iPhone) is the unfortunate fact that a user can choose to “Reduce Motion” in their [ Settings > Accesibility > Motion ] preferences.

This means if you are using animation for semi-utilitarian needs ( like moving a pinned header out of the way by shrinking it, or sliding cards ) … you can’t! Because even if the user doesn’t activate Reduce Motion themselves ( which is also a battery-saving hack ), it may still be activated by their phone when in low battery mode.

So essentially, I guess we need to enable “Reduce Motion” on our testing devices and make sure the site is usable that way before committing to any motion effects.

Hope this helps!