Jump to content
GreenSock

Mike D

v1.9.3 className issue

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 just updated GSAP to the latest version and am now noticing an error that's happening with class names. I have a div element with multiple class names.

 

<div class='myclass one default'>...</div>

 

If i  run this:

 

TweenLite.to( '.myclass', 3, { className: '-=default' } );

 

There are spaces being removed and result in the following which breaks not only the CSS rules but also any jQuery calls to this element (e.g. $('.myclass.one') ).

 

<div class='myclassone'>...</div>

Everything was working fine until I upgraded to the latest version. Any suggestions?

Link to comment
Share on other sites

Sorry about that - it was indeed a regression that only affected className tweens with "-=" prefixes and 3 or more classes, but I just posted an update (literally added a single space to the code in one spot) and uploaded that now. It's in the zip download and on github. It's not on the CDN yet. Again, I apologize for the glitch. 

Link to comment
Share on other sites

Best support on the planet. Fixed and THANK YOU.

Link to comment
Share on other sites

Found one more issue with this. If you use +=someClass on an element that already has .someClass, it creates a duplicate class instead of intelligently checking that the class already exists.

 

So now you end up with

 

<div class='someClass someClass'>...</div>

 

Here's a quick example http://jsfiddle.net/943mD/

Link to comment
Share on other sites

I don't think that matters functionally, but we'll get it patched in the next release. Thanks for pointing that out. 

Link to comment
Share on other sites

Thanks.

 

So i guess then, for any Tween using -= or += with the className property, I would need to handle duplicate classes via jQuery.removeClass('...') beforehand? The catch is I'm stitching multiple tweens together using TimelineLite that are using -= or += for className so I need to figure out a way to remove the class (using jquery) right before I add the tween +=class back in.

 

Does that make sense? Thoughts?

Link to comment
Share on other sites

This should be fixed now in the latest push (uploaded a few minutes ago) :)

Link to comment
Share on other sites

You're a scholar and a gentleman. 

Link to comment
Share on other sites

Works perfectly now - thank you again for the amazing work on this library and the stellar support. 

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