Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

Problem with ScrollTrigger timeline onComplete

Go to solution Solved by Rodrigo,

Recommended Posts



I am having a problem with running a function inside a timeline with onComplete.

Instead of running when the tween is complete, the function runs when page loads.

Am I missing something obvious here?

Created a codepen with a simplified example.



See the Pen QWpENqO by joel-udd (@joel-udd) on CodePen

Link to comment
Share on other sites

  • Solution

Hi and welcome to the GreenSock forums.


The issue is that right now you're executing the function, so as soon as the browser gets to that part of the code the playSound function is executed.


GSAP has an excellent callback system that allows you to pass parameters, set scope, etc. This should work as expected:

tl.to("#knapp", {
  background: "#a6a6a6",
  onComplete: playSound,
  onCompleteParams: ["knapp0"]

Here you can learn more about callbacks, just scroll down to the Special Properties section:



Happy Tweening!!!

  • Like 4
Link to comment
Share on other sites

That worked perfectly!


Thank you so much for the quick response!

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.