[TimelineLite Not working in Chrome, Need for help !]

Hi jimyu0414,

 

Welcome to the forums! 

 

You said it yourself: "the code is actually working" - So, TimelineLite is working in Chrome. What seems to be wrong is your setup.

 

Elements inside of the <defs> tag are not part of the DOM tree, they don't get rendered into view so, animating them is not advisable. There are ways, of course, but I don't think it is applicable for what you are trying to achieve.

 

I have forked your pen and made a couple of changes, I hope this is what you were looking for.

 

See the Pen dXdZNq?editors=1010 by dipscom (@dipscom) on CodePen

 

If you want to animate something inside of a mask, make sure the mask is on its own element - in this case the <g> I created as a wrapper for your <use> element. Then, animate whatever it is that you need inside that <g>.

 

Hope this helps.

Hi Dipscom

 

Thank you for the comments and demo, it's a great lesson.

[TimelineLite Not working in Chrome, Need for help !]

I write a mask animation which is working fine in firefox and afari. However, there is no animation effects in Chrome, ( the code is actually working ) I couldn't figure out why. 

See the Pen ezJeaj by jimyu0414 (@jimyu0414) on CodePen