In this workshop, we’ll create a web page that scrolls horizontally like a timeline. We’ll be focussing on basic element structure, styling and the interactions 2.0 scroll trigger.
To learn more about creating your own horizontal scrolling page, visit these two articles:
Hey Nelson, I recently built up my first website on webflow… As I had the idea from a horizontal scrolling page in my mind already before, your video was very helpful!
Now I’m stucking with the mobile version… I would like to show the website just on landscape mode and let the visiters swipe horizontally to scroll.
Is that possible? At the moment you have to swipe verticalle to let the website scroll horizontally- wich is of course very confusing!
@PixelGeek - what if you are using this for a CMS list and you don’t know your vw because it’s for a CMS list and it could be 5 items (500vw) or it could just be 3 (300vw)? Can you just put 100vw on each CMS item div block and then set the wrapper to like what? auto???
However, my own personal opinion on using that is you’re confusing the user by taking over their scrollwheel function. This is known as scrolljacking . I would suggest just using Webflow interactions instead of this.
Thank you for a quick reply. BTW your tutorials are amazing. allways have a fun to watching you
I would like to achieve something like on this site (BIG | Bjarke Ingels Group). Just changing image with scrollwheel. It seems to me like really nice gallery movement without any “unwanted effects”. Just changing nice images but i dont know how to achieve this.
thanks for the amazing tutorial. I’m finding a problem because I want the horizontal scroll to be the second section of my website, after my landing page, It seems the only way this can work is with position fixed to the top right corner, but I can’t set that position if i have the home section on top, any ideas on how to overcome this?