Tweening "boxShadow" - 'none'-property bug?!

[Donatello666 3 Likes (Newbie)]

Hi,

 

i`m experience a bug in tweening 'boxShadow'. By tweening to a boxshadow and tweening back to 'none', TweenMax tweens to boxShadow:'0px 0px 0px 0px rgba(153,153,153)

 

i tried different browsers (FF, FF dev, Safari, Chome), same result.

 

Here is an codepen(from another topic), but updated with a boxShadow on hover:

 

See the Pen OxERYq by Michelangelo666 (@Michelangelo666) on CodePen

 

[OSUblake 18,477 Likes (Superhero)]

Hi @Michelangelo666

 

How is GSAP supposed to know where to start from when the box shadow is none? It can't. Make your shadow transparent and you should be good.

 

See the Pen 07a08e579222e7a5f023d69776e4ac51 by osublake (@osublake) on CodePen

 

[Donatello666 3 Likes (Newbie)]

Ok Thanks a lot,

 

thought 'none' is a possible value for 'border', boxShadow' etc. ..., like 'from shadow to no shadow'. Never used 'none' before...

[OSUblake 18,477 Likes (Superhero)]

It is, but how do you change from none to 2px 2px 6px rgba(0,0,0,.7) ? What is the very first value going to be?

[Donatello666 3 Likes (Newbie)]

hi,

 

my pov was simple: OK this div has no shadow, when i hover it, it get's an shadow of ..., on hover out i want go back (animated via Greensock) to no shadow.

I don't know the engine of Greensock (btw: i love greensock), but i thought greensock sees 'border:none' == 'border:0px' or similar.

 

sorry, perhaps my english is not that good to explain it more detailed...

 

[OSUblake 18,477 Likes (Superhero)]

I understand what you mean, but that's just an assumption that none == 0. It's kind of like trying to animate from display:none to display:block. How should that work?

 

At its core, GSAP only works with numbers, and it needs a start and end number to work with.

 

Here's a similar question somebody had about wanting GSAP to assume that 0 should be the default value.