Jump to content
GreenSock

gigocabrera

Members
  • Posts

    5
  • Joined

  • Last visited

Posts posted by gigocabrera

  1. 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. 

    • Like 1
  2. 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
  3. 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

  4. 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
    • Like 1
  5. 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})
×