Horizontal scroll effect section too long

Design help Animations & Interactions
#1

Hi all,

my horizontal scroll section is a bit too long, I can’t figure it out. The height is 450VH and it doesn’t effect it at all if I write a smaller number. Also I tried to change different widths and highs on “The Height 400VH Section”, “stickydiv”, “background”, “The Width 400VH Scrollable Div” none of them do it. :exploding_head:

  1. How do I shorten the horizontal scroll section an the end on desktop?
  2. How can I smooth the interaction, so the scroll goes vertical again after showing the last element on the horizontal section full and not before?
  3. How can I do it on mobile? The unfilled black area is here way longer.

Thanks in advance for any help!
Viktoriya

Here is my public share link: LINK
(how to access public share link)

#2

1. Don’t use VH for width size (Add padding -or- margin -or- % - VW and so on - google box-model) (400vh on mobile portrait mode = 4 times the height of the screen = very long scroll).

2. Try Aaron Grieve tutorial (Looks great):

clone: https://webflow.com/website/Side-Scrolling-with-IX2?s=side-scrolling-in-ix2

Demo: http://side-scrolling-in-ix2.webflow.io/

3. Add screenshot (Hard to answer + Also in your page where is the scroll area?)