GSAP Draggable instance with parallax effect on object

[51North]

I want to create a parallax effect in a Draggable instance, but need some help.

 

I already did setup a codepen with Draggable instance, where you can drag a space background. In front of the space background I have an image of a rocket.

 

Is there a way to add a different drag speed/delay/value to the rocket so it looks like being in front of the background?

 

See the Pen MWZJoWW by Tom51north (@Tom51north) on CodePen

[Rodrigo]

Hi @51North and welcome to the GreenSock forums!

 

Thanks for being a Club GreenSock member and supporting GreenSock!

 

My approach would be to use a QuickTo instance in the onDrag and onThrowUpdate callbacks:

https://greensock.com/docs/v3/GSAP/gsap.quickTo()

 

Maybe something like this:

See the Pen WNLRdXR by GreenSock (@GreenSock) on CodePen

 

Hopefully this helps.

Happy Tweening!