Issue with the Flawless Horizontal scroll
I been using this cool webflow native in every single project but recently found some issue with the scroll.
And it's happening on the website made by @Web Bae as a cloanable.
Here is a loom video in the issue I am facing. @Web Bae
https://www.loom.com/share/589c254b3da3490b9872c60afc1e777e
5 Replies
@saurabhchakradhari thanks for the heads up! It looks like something changed in the browser in how it calculates height or width or something weird! I was able to fix it by:
1. Change
horizontal-scroll-wrap padding top to 100vh. (Remove other padding value).
2. Change sticky padding top to -100vh (Remove other padding value).
3. Add 25% offset to the animation end condition.
Working on my end for any number of sections with different widths as well. Please let me know if you run into any issues.
@Web Bae Hey, I tried the same method but It didn't work for me.
Can you make a similar horizontal scroll clonable webflow website with the changes which you just mentions.
It will be very helpful
@saurabhchakradhari I updated the cloneable is it still not working for you? https://webflow.grsm.io/cloneable-is-bae?sub1=flawless-horizontal-scroll
Flawless Horizontal Scroll
Flawless Horizontal Scroll - Webflow
How to build horizontal scrolling sections in Webflow using only one interaction that works for any number of sections with any sizes. This animation observes the user's downward scroll behavior and translates a separate div block to the left to achieve a cool horizontal scroll effect. We'll look at some pro level css tricks with overflow, flexb...
Oh sorry, I didn't check it at that time.
Just checked it and it's working perfectly fine.
Thanks a lot.
I'm still not sure if it's a browser issue or a webflow issue. Very strange though.
Will keep an eye on it. Let me know.