Jump to content


Animation skipped after just adding a div ?

Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

I notice that a fade (using autoAlpha) doesn't occur when I create a new div, add it to it's parent that is visible on the screen, and directly perform a fade (autoAlpha change from 0 -> 1).


However, if then replace it with some other div, and latter add it again, the animation does occur.   Why?


Apparently because it was already created has impact on the GSAP to decide that animation is allowed, maybe because it has dimensions ?...

Why is this and how can I ensure the animation always occur?

- Ed

Link to comment
Share on other sites

I will, but need some time for that as I generate the js from java, so I hope I can reproduce it.


But can you tell me when the GSAP decides to not perform the animation?


(I just test a bit more and noticed that it has dimensions when the tween.to() method called)

Link to comment
Share on other sites

i made a codepen for you , and cant find out what you mean !? :)

pls check this out :


See the Pen jEOrrR by MAW (@MAW) on CodePen

  • Like 4
Link to comment
Share on other sites

Hello edbras,


Just so we understand.. are your elements supposed to be hidden when the page loads, so GSAP can animate them from invisible to visible?

Link to comment
Share on other sites

Sorrrrry for the very late reply.

I forgot to turn on post-notifications and was at some 24 hour hakacton :(.

Anyway thanks for the reply.

@Diaco. My use case is listed here: 

See the Pen OPJZoy by edbras (@edbras) on CodePen

(I forked yours), and as you see, it works just fine.

I just discovered I had some stupid bug in my code :(...: when opacity wasn't set on a div, it returned "0", such that no fade occurred the first time till it was explicitly set. I changed it and works fine now.

Sorry for the stupid bug and thanks for all the feedback,

- Ed

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.