GSAP and Draggable conflicts?

[glenn_pot]

I'm running two completely separate functions and loading 4 libraries/plugins:

/gsap.min.js

/TweenMax.min.js

/Draggable.min.js

/ThrowPropsPlugin.min.js

 

function #1 is uses the gsap.timeline tool 

function #2 is uses TweenLite, Draggable and ThrowPropsPlugin.

 

#1 works great if I comment out the TweenMax, Draggable and ThrowProps scripts.

#2 works great if I comment out the gsap.min.js script.

 

Is there some obvious reason why they won't work together?

 

[ZachSaucier]

Hey Glenn. TweenMax is from the old version of GSAP - you shouldn't use it. You just need the GSAP core file (gsap.min.js) and the GSAP 3 versions of the plugins. See the migration guide for more info.

[glenn_pot]

Thanks for the super quick reply @ZachSaucier.

This is the TweenMax, Draggable, ThrowProps portion of my code, which works but I guess now needs to be updated.

See the Pen NWRoJjp by glenn_pot (@glenn_pot) on CodePen.

 

I read the guide you shared and swapped out TweenLite and TweenMax instances and I'm getting "Uncaught ReferenceError: Draggable is not defined"

See the Pen VwKRpYe by glenn_pot (@glenn_pot) on CodePen.

[PointC]

Your pen is still loading Draggable 1.20. You'll need to use version 3 and use the inertia plugin instead of ThrowProps.

 

https://unpkg.com/gsap@3/dist/Draggable.min.js

 

See the Pen 5085a9936999d3a510ec69da5f2d5a0d by PointC (@PointC) on CodePen.

 

Happy tweening.

 

[glenn_pot]

Thanks @PointC, but I noticed that your demo with updated Draggable is still not working as it was here:

 

See the Pen NWRoJjp by glenn_pot (@glenn_pot) on CodePen.

[PointC]

It just needed a few more GSAP 3 updates. I thought you were going to do those. 

 

But here ya go.

See the Pen 5085a9936999d3a510ec69da5f2d5a0d by PointC (@PointC) on CodePen.

 

Happy tweening.

 

[glenn_pot]

@PointC I'm still not seeing a working carousel after these updates though. The error is gone now, but the slider build is still not working properly.

[PointC]

hmmm... seems okay to me. Maybe I didn't save when I reposted it. Should be alright now.

 

PS I made a slight adjustment to your update progress function. I seem to remember that GSAP 3 deprecated negative progress so I'm keeping it between 0—1 in the fork. 

[glenn_pot]

Thank you so much @PointC, huge help today. I've worked this into my project now and everything is working in tandem now

[PointC]

Happy to help. That's how we roll in the GreenSock neighborhood.

 

Thank you for your support with a Club membership. Good luck with your project.