I actually do have another question - is there a chance for the horizontal scroll section to not be 100vh, so next section is always visible on the bottom and once horizontal scroll is finished it scrolls normally? you can see my previous demo above - where there is section like 150px below the element i want to scroll horizontally.
I’ve tried somehow giving bottom section a fixed position and animating it, and I have tried to give overflow:hidden to a section, so instead of like 500vh(same as horizontal place) only like 400px would be visible, but then the horizontal scroll doesnt work. Is there any way to overcome this?
… if that is not possible to do with webflow, I would alternatively do something like this: Image 2018-09-21 at 9.52.01 PM
But I cannot figure this thing out either - when you click on arrow and one new element scrolls into view from right. I could use a slider, but then it would slide all four altogether and I probably wouldn’t be able to put mp4 on each tile hover (see OP).
Right now, I’ve set it so it looks perfect on Macbook Pro (1440x900), but when I look it on 27’ screen, since the VH is much bigger, the element scroll all the way through and beyond, so there’s probably 1600px of blank space before the ‘section 3’ appears.
Is there a solution to this, so it looks exactly the same on all screen heights? I opened your cloneable project and see the same problem there.
You can play around with the move interaction. Try to set the move to -59VW it’ll look a lot better, then you can just play with it until you get the perfect number for all screen sizes I also updated my clonable project if you just want to reclone it!
I am looking to accomplish this same thing with a horizontal scroll section that does not take up 100vh. Were you able to come up with a solution for this?
Thanks