[Proper way to kill all scrollTrigger listeners on page leave]

Hey, @Rodrigo!

Unfortunately, provided solution doesn't work for me. I have unsupported method error. Maybe I'm doing something wrong. More information: 

Having v2 of Vue, using destroyed webhook to kill triggers. Using 3.10.4 GSAP version and ScrollTrigger 3.11.2 version.

Tried to open scrollTrigger.js to find that method, there is no such method. 😒

 

import { ScrollTrigger } from 'gsap/dist/ScrollTrigger'

 

destroyed () {
  ScrollTrigger.killall()
}

 

[Proper way to kill all scrollTrigger listeners on page leave]

Thanx a lot, @Rodrigo !

[Proper way to kill all scrollTrigger listeners on page leave]

Hey guys! 

I have Vue application and one of the pages is using scrollTrigger. I want to know / understand how to to proper kill all scrollTrigger listeners on page leave. Thank you very much for your help.

[Animation after motion path complete]

Thanx a lot again, @mvaneijgen

[Animation after motion path complete]

Thank you very much @mvaneijgen! You're my hero

Last, small question.
How can I make floating 'yoyo' animation smoother without any easing? It seems like yoyo has some bounce effect with every easing I tried

[Animation after motion path complete]

Thank you very much for your help, @mvaneijgen

I think I figured out what the problem is, but I still don't know how to solve it. The point is that the object should float only at the end of the animation, when progress === 1, now it floats on initialization step and when it comes to progress === 1, animation starts from the moment it ended at initialization step.

 

Is it possible to do like this:
1) Static position of the object
2) The object moves along the path
3) when it reaches the end, floating animation starts

 

Thank you!

[Animation after motion path complete]

Thank you @GSAP Helper

Here is a small demo, you can see when you scroll to the end position, the floating animation jerks before playing

See the Pen yLjPGmx by -2-212321 (@-2-212321) on CodePen

Thank you for your help guys!

[Animation after motion path complete]

Hey Guys!

Faced a problem, I do not know how to solve, please help with advice.
I created animation using scroll trigger and motion path. The idea is to track scrolling using scroll trigger, then object move using motion path and at the end of the path additional animation start to work. Here is the small snippet: 

The problem is that when the path ends and the animation starts, it does not start smoothly, but at first with a jerk. Can someone please explain the best practices for tasks like this, thank you very much, have a nice day

const flow1 = gsap.fromTo('#coin', {
  y: -181.898 // End of the path coordinate 
}, {
  y: -212,
  yoyoEase: 'sine.inOut',
  repeat: -1,
  duration: 2.6
})

timeline.to('#coin', {
  opacity: 1,
  motionPath: {
    path: 'M292.801,16.834 C373.005,-181.943 489.752,-167.563 770.258,-181.898'
  },
  scrollTrigger: {
    trigger: '.big-form',
    start: 'top top',
    end: '+=300',
    scrub: 1,
    onUpdate: ({ progress }) => (progress === 1
      ? flow1.play()
      : flow1.pause())
  }
})