Trigger tweens with ScrollMagic

[senna]

Hello, I have a question about triggering tweens with the ScrollMagic plugin

 

I created a ScrollMagic page where I animated with CSS, but I prefer to do transform ect with GreenSock. 

The problem is that when I want to trigger tweens, it doesn't work. 

 

This is the code: 

 

I also have a WORKING code, but this is with CSS animation, and not what I want: 

See the Pen RGpyGz%C2%A0 by codesen (@codesen) on CodePen

 

 

I used this as an example: http://scrollmagic.io/examples/basic/simple_tweening.html 

 

I think the problem is in line 10: .setTween("#project01", 0.5, {backgroundColor: "green"}) 

 

 

I hope you can help!

See the Pen LRLEYZ by codesen (@codesen) on CodePen

[PointC]

Hi senna 

 

You're just missing one file. Please add this to your pen:

https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/plugins/animation.gsap.js

That should get you working correctly.

 

More info on that plugin can be found here:

http://scrollmagic.io/docs/animation.GSAP.html

 

Happy tweening.

[senna]

Thanks PointC! That was easy