Jump to content

Tom B. @ Wix

Possible Bug: Inconsistent 'clearProps' behaviour

Recommended Posts

I stumbled upon a weird behaviour of clearProps, and couldn't find any reference to whether it is a bug or not.


When using clearProps with explicit values the order of the parameters passed has importance when clearing mixed transforms/properties values.


This will clear x and y and skip opacity - 

clearProps:'x, y, opacity' 

This will clear only "opacity" and skip x and y.

clearProps: 'opacity, x, y'

Same goes with other non transform values like "clip"


See the codepen for clearer example.

See the Pen ufphl by tombigel (@tombigel) on CodePen

Edited by Tom B.
Link to comment
Share on other sites

Hi Tom B.  :)


seems there is a little issue , pls remove any blank space between " , " and " property names " and that'ill work .


Bad = clearProps:'x  , y,  opacity' 


Good = clearProps:'x,y,opacity' 


sometimes the blank space 'ill avoid to clear next property ! 

  • Like 1
Link to comment
Share on other sites

Also be aware that clearProps is intended for cleaning up the inline styles used by GSAP, and not necessarily resetting individual values, so clearing x or y actually clears the entire transform style. This is why you're seeing it work for both x and y without opacity in the first example. Only the x was being parsed but that was clearing the whole transform anyway.

TweenLite.to("#foo", 2, { x:100, y:200, clearProps:"x" })
// clears the transform style, resetting both x and y transforms

The docs do mention that clearProps is "a comma-delimited list" but I suppose that doesn't clarify that extra white space won't be trimmed.

  • Like 2
Link to comment
Share on other sites

I'll add code to remove the spaces in the next release. I hadn't thought it necessary before, but obviously I miscalculated the user-friendliness of that, and my hyper-focus on file size and performance got the better of me :)

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