Hi, I’m building a horizontal scroll site with sections representing different years.
I want the first section to scroll immediately when the user starts scrolling horizontally.
But currently, the first section remains fixed until the last one scrolls into view.
I’m not using sticky on the sections, only on the year label.
Any idea what’s causing this scroll delay or how to make the scroll linear from the beginning?
and also the number of the year doesn’t change when I scroll back. hopefully someone can also fix this problem.
Thank you so much !
Here is my site Read-Only: [Webflow - SIYUE's Stellar Site](https://horizontal scrolling)
Hi there,
To achieve smooth horizontal scrolling from the start, here’s how to set up your scroll animation:
The Track Section height should be set using vw units, calculated based on the total number of sections you’re scrolling through. For your Camera Div block, ensure these essential properties are set:
- Position: sticky
- Top: 0px
- Overflow: hidden
To fine-tune the scrolling motion, access the Interactions panel and locate Animation boundaries. Adjust both start and end percentages until you achieve the desired smooth scrolling effect from the first section onward.
Regarding the year numbers, please share more details about how they’re implemented in your design, including any interactions or animations currently applied to them.
Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.
Hi I think I’ve got an even worse result: my year-section doesn’t work with sticky position.
I want my content wrapper section scroll horizontally section by section. when the first section scroll out all the content and second one came up. Mean while the year number which is show up on the page is changed by the related section scrolled in.
please please help me out
[type or paste code here](https://preview.webflow.com/preview/siyues-stellar-site?utm_medium=preview_link&utm_source=designer&utm_content=siyues-stellar-site&preview=a2a7babd981e8d7bf1929ebf210913b4&pageId=6873acacbe7a73913f6f9d41&locale=en&workflow=preview)