TimelineLite & Morph

[AgathaCrystal]

Hi,
I created this animation  and tried to import it to my website. 

 

 

Surprisingly i only got the first part of my animation working and after some fiddling I got the same result in Codepen, while there are basically the same libraries loaded.

See the Pen eYNLZYX by Philastan (@Philastan) on CodePen.

 

After reading in the documentary I ended up trying to use 

tl = gsap.timeline({ paused:true });

instead of the timelineLight - but still: Same issue. It seems like Gsap gets stuck at the Morphing Part.

 

I am happy about any kind of help!

 

Phil

 

See the Pen VwLRMwx by Philastan (@Philastan) on CodePen.

[ZachSaucier]

Hey Agatha and welcome to the GreenSock forums! Thanks for being a Club GreenSock member. We couldn't do what we do without people like you.

 

It think the main issue is that you're trying to mix GSAP 3 with GSAP 2 plugins. They aren't compatible. You should download the GSAP 3 files and use those plugins instead. An easy way to find the download is on our installation page.

 

Putting your code into our GSAP 3 starter pen (which loads all of the GSAP 3 plugins as well) shows it working once you load jQuery:

See the Pen ExjMwmb?editors=0010 by GreenSock (@GreenSock) on CodePen.

 

While you're working on it, why not use all GSAP 3's format? It's even more simple using defaults  Also note that you don't have to put the values in quotes and give units. You also don't have to use the Max/Lite stuff any more. It's way better!

See the Pen eYNXGRW?editors=0010 by GreenSock (@GreenSock) on CodePen.

[AgathaCrystal]

Wow, awesome!!! So many usefull informations  Thanks a lot!