Text Glow

[LewisOne 1 Likes (Newbie)]

So, I wanted to animate a glow around some text, but was not happy with the size of the glow size and since css does not have spread like box shadows do I tried this quick fix:

 

TweenMax.set(".text", {

    textShadow:"10px 0px 20px rgba(255, 255, 255, 1)",

    textShadow:"-10px 0px 20px rgba(255, 255, 255, 1)",

    textShadow:"0px 10px 20px rgba(255, 255, 255, 1)",

    textShadow:"0px -10px 20px rgba(255, 255, 255, 1)"

});

 

However it only fires one of the actions (bottom glow with no top, right, or left)?

 

I thought that maybe it was just a css limit but when I did this it worked like a charm:

 

.text {

    text-shadow: 5px 0px 10px white, 0px 5px 10px white, -5px 0px 10px white, 0px -5px 10px white;

}

 

 

Still would be cool to animate the glow (make it pulse) but could not get the TweenMax textShadow to work.

 

Any Ideas?  I'm pretty darn sure I'm just formatting it wrong.

[jamiejefferson 1,185 Likes (Superhero)]

TweenMax.set(".text", {

textShadow:"5px 0px 10px white, 0px 5px 10px white, -5px 0px 10px white, 0px -5px 10px white"

});

[LewisOne 1 Likes (Newbie)]

Jamie's a genius.

[Carl 9,066 Likes (Superhero)]

Yup.