[Please help a noob]

I got it working - whooohooo

 

You guys are awesome. Thank you very much for all your help!!!

 

I will write a blog post on my site on how to add GSAP and CustomEase to an ionic 2 project based on what I learned from you guys. I'm sure other noobs like me could benefit from it. 

[Please help a noob]

Ok, getting closer I think

 

I download GSAP and extracted the CustomEase.min.js file, added it to my project and created a script tag referencing the library. I know it is correctly being referenced in my app because I see it in View Page Source

 

My challenge at this point I think is how to use it in a TypeScript project. Ionic2 is based on TypeScript so when I try to add the create method below, TypeScript complains with [ts] Cannot find name 'CustomEase'

CustomEase.create

[Please help a noob]

I'm using GSAP in my ionic 2 app and I got it installed through the npm package. In order to make gsap to work, I added 

import 'gsap';

 to my app.module.ts and again, everything works like a charm.

 

How do I install the Custom Ease?

 

I added the following entry to my index.html page but not sure if I need an Import statement like the one for gsap.

<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.1/easing/EasePack.min.js"></script>

By the way, just with the entry in the index.html page it doesn't work

[Please help a noob]

Carl, thank you very much for the example. Exactly what I was looking for!!!

 

However, I'm getting an error when I try to use the CustomEase method. Is this a separate library I need to add to my project?

CustomEase.create

[Please help a noob]

I have the following code and it works like a charm. Every card (card1, card2, etc...) "travels" from position 1000 to original with a .1 speed. 

 

What I'm trying to accomplish is to have every card travel at speed ".1" until it reaches 80% of "y" and then travel at a lower speed for the rest of the "trip". 

 

How can I achieve this?

tl: any;
this.tl = new TimelineMax({delay: 1});
this.tl
      .from(card1, .1, { y: 1000})
      .from(card2, .1, { y: 1000})
      .from(card3, .1, { y: 1000})
      .from(card4, .1, { y: 1000})
      .from(card5, .1, { y: 1000})
      .from(card6, .1, { y: 1000})