Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

className - Toggle?

Recommended Posts

Hi guys,


Just quickly (I haven't got time atm to slap an example codepen together), is there a way to toggle the CSS className attribute?



I have an object that's being manipulated a lot, and one of the tweens is removing a class from an element, and animating it's new position accordingly.

className: '-=responsive-example_small'

This works fine, until I reverse the timeline... At which point the class isn't re-added to object, and obviously, no animation occurs, resulting in a broken reverse animation.


I know I can remove the "-=", but that overwrites all the classes on the element in question as well, which is again, undesirable and dangerous to maintain.


Is there a toggle for ClassName that I simply haven't come across before? Much like JQuery's $(e).toggleClass('someClass')?


If not, is it a possibility for the future?



Thanks a lot! :)

Link to comment
Share on other sites

Hi kez1304  :)


I don't know why it wouldn't work on reverse. Without a CodePen it's a hard to troubleshoot.


Here's a simple example of the timeline reversing after removing a class on play() and it all works correctly.


See the Pen wgwmOV by PointC (@PointC) on CodePen


Without seeing the problem, I'm not sure what else we can offer you for a solution.


Happy tweening.


  • Like 2
Link to comment
Share on other sites



I see my problem now, I'm invalidate()-ing the timeline before I reverse it, which is destroying the link I assume...


Is there any way around this?

Link to comment
Share on other sites

We'd have to see why you're animating via a class change rather than animating the properties in the tween and the reason for the invalidate(). 


Feel free to fork my pen from above and recreate a simplified version of the problem you're experiencing. Without code and a desired behavior, it's tough to give the best advice.


Happy tweening.


  • Like 3
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.