2 titles animation pause
Hello, i am using locomotive and gsap scroll trigger.
i Have 2 titles ( fade-up-title and fade-up-subtitle), i need in first, the title to fade-up then Pin till the second(subtitle animation complete) and then start the fading-up (the .to function)
var tls = gsap.timeline({
scrollTrigger: {
trigger: ".text-banner",
scroller: ".o-scroll",
scrub: true,
start: "top top",
end: "+=100%"
For your scenario, one way would be to set the section to be 100vh in your CSS and use a pinning ScrollTrigger to pin the entire section. Then you could easily adjust the end to make the animation have whatever duration you wish, and by adjusting the position parameter of the tweens inside your timeline accordingly , you could have the texts animate out whenever you wish.
One problem I am seeing, is that you are using the data-attributes that come with locomotive-scroll and are mixin
