I’m presenting a very simple way of making a fancy text blinking using only HTML and CSS3. Adjust the values, setting a different blinking speed and colors.
I am blinking!
I’m using a span tag and assigning the blinking class to it.
<span class="blinking">Am I blinking?</span>
And finally the CSS code:
.blinking{ animation:blinkingText 1.2s infinite; } @keyframes blinkingText{ 0%{ color: #000; } 49%{ color: #000; } 60%{ color: transparent; } 99%{ color:transparent; } 100%{ color: #000; } }
See the live demo at JSFiffle.
Another way of doing this is changing the opacity the same way I’m changing the text color.