[Using GSAP with Angular2]

Install greensock.d.ts in typing.json

and it will work....

[Question cssruleplugin get pseudo-elements]

Hi, everyone.

 

I read the spec and know that I can tween the css pseudo-elements (':before', ':after') using 

CSSRulePlugin.getRule

 

What if I have several elements with the same class name and all of them have pseudo-elements and I want to tween them individually? Is this possible?

 

I tried the CSSRulePlugin.getRule function, and the tween would change all the elements' pseudo-elements.

 

 

Thanks in advance.

[Question about TimelineMax paused properties]

Thanks Carl and Diaco

 

That's what I want....

[Question about TimelineMax paused properties]

Hi, I am pretty new to GreenSock, so i might ask a silly question.

 

Problem is I create a variable like:

 

var tl = new TimelineMax({paused:true, repeat: -1});

 

and i set the tl.from(element, 1, {opacity: 1});   element's original css opacity is 0

 

and i will play it in some onClick function.

 

Problem is my element original opacity is 0, and before I trigger Click event, the above code would already set my element opacity to 1. This is not what i want.

 

What I want is that the element's opacity is 0, when I play the TimelineMax, i would play a tween to make my element from opacity:1 to opacity: 0

 

 

Here is my codepen: 

 

Hope someone could give me a hint, thanks....

See the Pen wMyLMZ by DanielYKPan (@DanielYKPan) on CodePen

[TimeLineMax hover handle]

Hi, Diaco

 

Thanks for your reply!

For my real project,  I need to use Timelines for better time control. Good to know that clear() function in Timelines!!!!

[TimeLineMax hover handle]

Hi daniel_pan  ,

 

Welcome to the forums. 

 

You can just set up one timeline and then play() on hover and reverse() on hover out.

 

Here's a fork of your pen: 

See the Pen mVmxgK?editors=101 by PointC (@PointC) on CodePen

 

Hopefully this helps.

 

Thanks for your reply!

 

I tried this before, and it did what i want for the hove in and out scenario.

But i don't like the reverse animation because the staggerTo from reverse would start from the last item. I want it to start from the first item when hover out.

 

Any idea i could achieve this?

[TimeLineMax hover handle]

Hi, I am pretty new to GSAP.

 

I may make a pretty stupid question.

 

What I want to do is when I hover in an element, it triggers a Timeline animation.

And When i hover out, it triggers another one.

 

Problem is when the hover-in animation not finished and i hover out, the hover-out animation would have to wait the hover-in animation to finish. And if i hove in and out so many times, it will trigger so many in and out animations. What i want is when hover out, it would stop the hover-in animation and start the hover-out animation.

 

Here is the demo code: 

 

Again, i may make a stupid question and hope someone could help.

 

 

See the Pen XXREZb by DanielYKPan (@DanielYKPan) on CodePen