Jump to content
GreenSock

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

Text Glow

Recommended Posts

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.

Link to comment
Share on other sites

TweenMax.set(".text", {

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

});

  • Like 1
Link to comment
Share on other sites

Yup.

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