Hey guys, i am trying to make an x amount of sections and i want each section to have its animation. The only thing is that i don't know how to adjust the height (or duration) for each section because i want each section's duration to vary.
For example, in the codepen i provided i'd like:
1. for the first section to scroll 2000px , during that time the svg elements will move at a different speed upwards creating a parallax effect
2. for the second section the svg camera is coming up on top of the first section and zooming in its squared display (by scaling up the camera), at which point when the display's border touches the screen's viewport width the third section will appear from the center. So its duration should be longer than the first section's duration.
Basically i want absolute control over the entrance and exit points of each section as well as their duration.
I messed around with the start and end values of each section quite a lot and i can't wrap my head around it. Any help is greatly appreciated!
