Jump to content
Search Community

How to Clear All the animated values and properties on TimelineMax at once using clearProps or proper method (SOLVED)

Yashi-2 test
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

Hi, I want to know how to clear all the animated properties from TimelineMax at once. not individual. like onComplete clearProp all or something like that and all the nested elements also. is there a way to use wildcard selector?

 

 

 ex: 

 

var tl = new TimelineMax({id:"sliderOut", autoRemoveChildren:true, onComplete:function(){
    // i want to clear all the animated values and properties at once not individual
  }});


tl
      .staggerTo($nameSplit.chars, 0.4, {y:'-10', autoAlpha:0, ease:Power4.easeInOut},0.05,"+=0")
      .staggerTo($descSplit.words, 0.4, {y:'-10', autoAlpha:0, ease:Power4.easeInOut},0.05,"-=0.5")
      .staggerTo($techSplit.lines, 0.4, {x:'10', autoAlpha:0, ease:Power4.easeInOut},0.05,"-=0.5")
      .to($slide_img, 1, {yPercent:'10', autoAlpha:0, ease:Power4.easeOut},"-=0.5")
      .to($slide_left_svg_bg, 1.5, {x:'20%', autoAlpha:0, ease:Back.easeInOut},"-=0.5")
      .to($slide_right_svg_bg, 1.5, {x:'-20%', autoAlpha:0, ease:Back.easeInOut},"-=1.5")
      .staggerTo($staticTitleSplit.chars, 0.5, {y:'20', autoAlpha:0, ease:Back.easeOut},0.03,"-=1.5")
      .staggerTo($numSplit.chars, 0.5, {y:'20', autoAlpha:0, ease:Back.easeOut},0.03,"-=1.5")
      .to($left_out_bg, 0.5, {x:'100%', ease:Power4.easeOut},"-=0.5")
      .to($right_out_bg, 0.5, {x:'-100%', ease:Power4.easeOut},"-=0.5");
Link to comment
Share on other sites

hi, @Sahil thanks for your feedback.

 

and yes I know that method. but I want to clear all the timeline elements like $nameSplit.chars, $descSplit.chars so on. without specifying individual onComplete callback and onCompleteParams with clearProps. I want global onComplete to clearProp all the elements. is it possible to do? if you have time, can you show me how to do it simply?

Link to comment
Share on other sites

I am not sure, but I doubt something like this must be built into GSAP as it is really rare someone will need it. I think simplest way would be an onComplete callback on timeline as follows and manually pass all targets,

 

TweenMax.set(arrayOfElements, {clearProps: 'all'});

 

Following is similar thread that discusses same,

 

https://greensock.com/forums/topic/11320-clearprops-of-timeline/

  • Like 4
Link to comment
Share on other sites

  • Yashi-2 changed the title to How to Clear All the animated values and properties on TimelineMax at once using clearProps or proper method (SOLVED)

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.
×
×
  • Create New...