clearing all CSS properties on an animation element

[Jonathan 5,176 Likes (Superhero)]

How would you clear all CSS properties that were applied to an animation element by TweenMax?

var tween = TweenMax.to($image, 5, {css:{ scale:1.5 }, ease: Linear.easeInOut, 
       onComplete: function(){
	      tween.invalidate().progress(0);
	}
});

I basically want to reset or clear all CSS properties that TweenMax adds to the inline style tag. So i can get the element back to its original state before it was animated by TweenMax.

 

I was testing with tween.invalidate() .. but I was unsure if this was correct?

 

Thank you for any help!

[Rodrigo 2,662 Likes (Superhero)]

Hi

Invalidate will clear the tween instance vars, use clearProps for that. Look at the following link:

 

http://forums.greensock.com/topic/8091-reset-inline-style-value-when-returned-to-default/

 

Hope this helps

Cheers

Rodrigo

[Jonathan 5,176 Likes (Superhero)]

Awesome, thanks for the quick answer!

 

Do you know if there is a way to call clearProps without having to wait until the tween completes?

 

Thanks again for the help!

[GreenSock 8,117 Likes (Superhero)]

Sure. 

TweenLite.set(yourElement, {clearProps:"all"});

[Jonathan 5,176 Likes (Superhero)]

Awesome.. thanks Jack... Worked like a charm!