Hello, I am using Angular 9 with GSAP, however being a single page application I have to kill the triggers each time I leave a page using
const triggers = ScrollTrigger.getAll();
if (triggers) {
triggers.forEach((trigger) => {
trigger.kill();
})
}
However, each time I come back to a page where I have my animations instantiated (OnInit) the animations gets correctly created however the triggers get translate way below the actual point where they are supposed to be.
This is the component part
constructor(private _gsapService: GsapService) { }
ngOnInit(): void {
this.fadeIn1();
this.an1();
this.an2();
this.an3();
this.an4();
this.an5();
this.an6();
this.pc();
this.highLight();
this.setItem();
this.an7();
this.an8();
console.log(ScrollTrigger.getAll())
}
ngOnDestroy(): void {
this._gsapService.killAnimations();
console.log(ScrollTrigger.getAll())
}
Thank you for any help you can give me