scrollTrigger Animation

[fpigletov]

Hi, there
I got one issue with building animation on my website. 

At first (after site loaded) i have an animation tied to scroll, to make it works smoothly i set the end '+=3000'. Everything works fine. But i have problems with next sections. I cant undersatnd how to set 'start" for their "scrollTrigger". Need to calculate 'start' for each section? if 1st section 3000px, so next one should start at 3100px for example and next 3100px + height of previous section etc. Or your have much easier solution? 

[Cassie]

Hello there!

 

Do you have a simple minimal demo? It's hard to see without looking at your setup and what you're trying to achieve. It sounds like maybe you don't realise that the trigger can be any element, it doesn't have to be the body. Each section can 'trigger' itself.
 

scrollTrigger: {
  trigger: ".section",
  start: "top bottom", // when the top of the trigger hits the bottom of the viewport
  end: "bottom top", // when the bottom of the trigger hits the top of the viewport
}

If you're still stuck a demo would be great - we can tweak it and get you on the right track!

 

Hope this helps!