Like the Dyson site

Hi

I would like this horizontal box type effect on my mobile site !

It’s on the Dyson website. You scroll down and then when you get to that section you can stop and scroll left or right, but you can also roll down and slip the section if you want. The link to the site is below. You need to make the browser width small. Can anyone point me into the right direction please.

Thanks

Jason


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Not natively from Webflow, no. You may use other libraries to achieve this though. Swiper is a good example.

You can easily do this in Webflow, if I’m understanding you correctly.

Just set that section’s overflow setting to scroll, and put an inner wrapper with a width of 500vw, or whatever you need.

As a matter of fact, I believe Dyson is just using a slider and this exact scenario is what Nelson is doing a workshop on right now.

Yes, I think @Cricitem is right.
You could perhaps also set the width of each card to be 80vw (80% of the viewport width, but perhaps you’ll need to fine tune this) so as to allow the next card to the right to be in view, if you get my meaning.

How weird, that the item I was looking for was actually that nights workshop. I’ve implemented it already and it. works well. Thanks everyone.

1 Like