Scroll Animation not working in preview link

Design help General
1

The icons on the bottom of the page are supposed to move up and change from 0 to full opacity when scrolled into view, but for some reason this only works when I preview the page in the designer. When I send a read only link to my coworkers the animations on the page are not working. I tried to make a preloader screen as well and it did not work on the preview link I sent out.

What have I done wrong? any help would be much appreciated

https://preview.webflow.com/preview/super-awesome-dental-land-4b5ec5f2c9723?utm_medium=preview_link&utm_source=designer&utm_content=super-awesome-dental-land-4b5ec5f2c9723&preview=a6711dba05975d205230bf58fd788f74&mode=preview

2

Hi @JenniferDesigns,

  1. The first section under the NavBar has no size set, so it’s actually allowing Section 3, just below it to remain in view.

  2. Add a size to the first section; like 100vh.

  3. Then the icon opacity will work :slight_smile:

See ya.

1 Like
3

@garymichael1313 Thank you for the response, I changed the first section to 100 VH but it’s still not working in the preview link :confused:

4

Yeah it works for me… here’s a video.

https://www.screencast.com/t/rdhwcNZb4jOh

Now it only works once. Make sure to add a “scroll out of view” to get it to repeat. All you have to do is:

  1. Copy the animation, this will make a duplicate.
  2. Go to Scroll out, add animation, click on the duplicate and simply delete the second two, then highlight the top two, and take off of initial state.