Question

I was wondering if there was any way to get text shadow to blink in CSS3. Can anyone help me out? Here is what I have and I just want the text shadow to blink. Thanks!

#container .title {
    color: #ba8b00;
    padding: 25px 0 30px 0;
    width: 560px;
    font-size: 42px;
    text-shadow: 3px 3px 5px #ba8b00;
}
Was it helpful?

Solution

This should help you to begin with

@-webkit-keyframes myfirst
{
    from {text-shadow: 3px 3px 5px #ba8b00;}
    to {text-shadow : none;}
}

@-moz-keyframes myfirst
{
    from {text-shadow: 3px 3px 5px #ba8b00;}
    to {text-shadow : none;}
}
@keyframes myfirst
{
    from {text-shadow: 3px 3px 5px #ba8b00;}
    to {text-shadow : none;}
}

#container .title {
    color: #ba8b00;
    padding: 25px 0 30px 0;
    width: 560px;
    font-size: 42px;
    text-shadow: 3px 3px 5px #ba8b00;
    -webkit-animation: myfirst 1s 98765432;
    -moz-animation: myfirst 1s 98765432;
    animation: myfirst 1s 98765432;
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top