Streaming live at 10am (PST)

Smooth scrolling with sticky elements

Hey guys,

I’ve built a site where I use Lottie animations which are triggered by using Webflows Interaction “While scrolling in view”.
Now I’m trying to implement smooth scrolling on the website, but for some reason this messes up my sticky sections. I’ve used https://webflow.com/website/Webflow-Smooth-Scroll-Luxyjs


How it behaves:

Here is my share link: https://preview.webflow.com/preview/smooth-scrolling-with-sticky-elements?utm_medium=preview_link&utm_source=designer&utm_content=smooth-scrolling-with-sticky-elements&preview=bf0e0b6c456953d9f10bafbc1ee734d2&mode=preview


What I already tried:

  • I’ve read somewhere that overflow: hidden; on the sticky section is the problem. This didn’t fix it though.
  • I also tried it with Locomotive Scroll (https://github.com/locomotivemtl/locomotive-scroll), however I still got the same problem and the smooth scrolling also didn’t work so well tbh.

Is there anything else I can try or use in order to make smooth scrolling work with sticky elements?

1 Like

I’m glad I’m not the only one. Let me know if you find a solution! I would greatly appreciate it.