GSAP OnComplete not being triggered, edge case?

[James135]

Take a look at this Pen's JS, the onComplete function should be getting triggered, but it isn't. However, the onUpdate is being triggered.

 

What could be causing this?

 

See the Pen xxWYQVM by StevenShmeven (@StevenShmeven) on CodePen

[James135]

Workaround: 

 

ScrollTrigger.addEventListener("scrollEnd", () => {
  console.log('done')
});

I updated the Pen

[GreenSock]

3 hours ago, James135 said:

Take a look at this Pen's JS, the onComplete function should be getting triggered, but it isn't. However, the onUpdate is being triggered.

Seems to be working perfectly - that tween animates everything all the way to the left, and you've got scrub: true, so the scrollbar basically moves the playhead on the tween, thus it wouldn't fire the onComplete until you scroll ALL the way down. See what I mean? Were you expecting it to fire every time you stopped scrolling? 

 

Sounds like you found the solution with the scrollEnd event. 👍

[James135]

Yeah, GSAP is elegantly coded

 

14 hours ago, GreenSock said:

Seems to be working perfectly - that tween animates everything all the way to the left, and you've got scrub: true, so the scrollbar basically moves the playhead on the tween, thus it wouldn't fire the onComplete until you scroll ALL the way down. See what I mean? Were you expecting it to fire every time you stopped scrolling? 

 

Sounds like you found the solution with the scrollEnd event. 👍