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:
- with smooth scrolling: https://smooth-scrolling-with-sticky-elements.webflow.io/
- without smooth scrolling: https://smooth-scrolling-with-sticky-elements.webflow.io/home-without-smooth-scrolling
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?