Scroll Into View Issues

Design help Animations & Interactions
1

I’ve been working on some interactions where I have a fixed block to the right (contained in a section) as I scroll down the page I have a scroll into view interaction set on the next section triggering the block to slide off the canvas (so move right by it’s width).

As I scroll back up I have an interaction on the above section again with scroll into view to then bring the block back. however the scroll down one work but the back up doesn’t also it appears as soon as the page loads the scroll into view is triggered and it initial state is set?

Here is my project https://preview.webflow.com/preview/straple?preview=e39274ceca2a0c967838183f1c7efbeb

Can anyone help this is infuriating I wish we had conditional statements to check the status of events.

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

2

Great question @bennraistrick! It looks like the scroll into view on multiple elements which are right after each other is causing the issue.

I would recommend to instead create a scroll into view and a when scrolled out of view animation for your header section and remove the interaction from your what section:
CloudApp

You’ll also need to adjust the interaction offset as both of those sections are set to 100vh for the height.

I hope that this is helpful, please feel free to reach out if you have any questions :man_bowing:, I’m here to help!

3

Ok it seems to be working now thanks, I set the offset to 100% and did what you suggested, so thanks for the help really appreciate it.