Parallax creating extra space

Design help Animations & Interactions
1

Hi everyone,

Adobe Muse user transitioning my site over and really loving Webflow but obviously experiencing a learning curve.

I’ve been using this tutorial from Webflow U to try and create an effect where the main page content rolls over a hero slider at a faster speed in a parallax fashion.

The effect is nice! But it’s creating some extra space at the bottom of my layout that I can’t get rid of. My assumption is since this effect requires the move interaction, I’m missing something where content isn’t properly finding the desired final position.

My initial thoughts were to:
a. Fix the hero slider
b. apply the same interaction to each section of the page.

But it doesn’t seem like these are the solutions.

Sharing my link to see if anyone has some advice. I’ve been messing around with breaking content out into larger sections/DIVs per point B above, so I have this space between the “about me” section and my quotes slider.

Here is my public share link: https://preview.webflow.com/preview/jonathans-first-project-4ae232?utm_source=jonathans-first-project-4ae232&preview=58871e7a0423206fcfba55b1241fb035

Thank you so much!

Jonathan

1 Like
2

Hey! Really easy fix here! I made a quick video showing you how you can achieve this without any weird spacing issues. Let me know if it helps. :wink:

Watch Video Here

1 Like
3

Dude! Thank you so much. This is by far the most detailed and helpful forum response I’ve ever received. I’m going to give it a try and see how it goes.

2 Likes
4

My absolute pleasure @jaydotjaymill! Wish you the best with the rest of your project! Looking great! :call_me_hand:t3:

5

As far as I can tell, this is working wonderfully and combines nicely with a little scroll reveal nav! Thanks again!

1 Like
6

Hey, no worries! Really glad I could help! :grin::call_me_hand:t3:

7

Is this video still available?