Forum Discussion

JoshuaThian's avatar
JoshuaThian
Community Member
23 hours ago

Help with javascript and GSAP

Hi,

I'm looking to do a card flip animation using javascript and GSAP.

However upon clicking my card, the card resets to the top left position of the player.

Seems like my gsap.set is causing the issue.

Refer to attached project for error.

 

Anyone can point out what is wrong with my code?

Thank you.

  • JoshuaThian's avatar
    JoshuaThian
    Community Member

    So, I managed to workaround the jumping issue by setting the gsap.set trigger to start when timeline starts at 0.01s instead of at start of layer timeline. 

     

    Probably there was some clash with articulate storyline layer loading and gsap.

     

    However, now I have run into another issue:

    (refer to attached storyline project)

    My first card on the left is working wonderfully, it works well no matter how many times i flip the card.

    However, after building the 2nd card (middle card), this 2nd card flips well from front to back to front. Any further flipping of this 2nd card causes the issue: the card face that is facing up is not flipping from 0 to 90degrees. It shows as a 'hang' in the animation, followed by the cardback flipping from 90 to 0degrees which works fine. 

     

    Any comments on how to solve this. Or is there any errors i made?