Jump to content
Search Community

How to remove style property from elements after animation!?

NubieHere test
Moderator Tag

Recommended Posts

When I use this:

tl.to( all_tiles, .25, { opacity: 0, stagger: .01, onComplete: removeClass, onCompleteParams: ['on']}); // I remove the class 'on' from the element, which should then set the opacity back to 0 for me to be able to 'reanimete' them again.

to 'reset' all tiles ... I cannot reanimate them again ... the 'style' property on the elements keep being: "opacity: 0" (of cource) ... But I'm using a class ('on') to set the opacity to 1 and when removing the class the opacity.

 

How to I get rid of the style property on the elements?

 

https://www.dropbox.com/s/z0stuaafq4umiwc/Screenshot 2021-07-04 at 12.29.03.png?dl=0

Link to comment
Share on other sites

Like @akapowl said, it's almost impossible to troubleshoot blind so a minimal demo would go a LONG way toward getting you a solid answer. 

 

From your description, it sure sounds like clearProps would be the solution, I agree. If it's not working, it probably has to do with something else in your code. 

 

You can remove the class in the onComplete like this (I assume all_tiles is an Array): 

tl.to( all_tiles, { 
  duration: 0.25,
  opacity: 0, 
  stagger: .01, 
  clearProps: "opacity",
  onComplete: () => all_tiles.forEach(el => el.classList.remove("on"), 
}); 

 

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