Expected result: When applying a Scroll into view Interaction to an element, fx applying the built-in “Fade” on When scrolled into view, it works on desktop, tablet, and mobile (Trigger Settings checked on all)
Bug description: When applying a Scroll into view Interaction to an element, fx applying the built-in “Fade” on When scrolled into view, it works fine on desktop, but no matter what I try or how I test it, it does NOT work on mobile.
Hi @jonatanronsholdt can you please update your post with some more information so we can help you faster? Things like your read-only link & screenshots really helps us to help you faster.
How to share a read-only link:
Thanks in advance! 
Hi @waldo! Thanks for the reply 
Really cool Webflow projects in your showcase btw!
I’ve debugged it 
It was due to the construction of my site design (body overflow property: hidden)…
So… I figured out why it did not work. It’s because the Scroll into view type of Interaction is dependent of the Body DOM element’s scroll position… It seems.
In my design I had made a div content container set to position:absolute; filling up the entire Body element, and the Body element set to overflow:hidden; and the div content container element’s overflow set to scroll.
So, when the x element that was supposed to trigger an animation on the x element itself was scrolled into view, the Interaction didn’t trigger, because (I suppose…) the body element’s scroll position did not change.
Now I’ve had to change the design / the structure of the entire site so that the body element’s overflow property is not set to overflow:hidden; and now all of the Scroll into view Interactions are all working as expected.
I would say this is a Webflow Interactions problem though. Yes, the specific use case of a design where the Body element’s overflow property is set to hidden might be more or less rare, but, none the less, Webflow should be as versatile and flexible as possible of course.
Perhaps the possibility to change the default scroll position container that the Scroll into view interactions depend on to something other than the Body element would be an idea? 
All the best,
Jonatan.
Okay so I just made a quick demo page:
https://interactions-scroll-into-view-test.webflow.io
&
https://interactions-scroll-into-view-test.webflow.io/body-overflow-default
Enjoy the cool cat gif.
The x element (a button…) with the Scroll into view triggered fade in Interaction animation at the very bottom of the page works perfectly fine all as expected on desktop, but on mobile, as initially described in this topic, things start going wrong. It does not work.
Just for the sake of good order here’s a screen recording showing the problem on mobile devices:
https://photos.app.goo.gl/EPXHLjyf86u8qNtL6
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.