CSS Change the color of text at random

Question

I know how to do this using JS, but in http://daneden.imtqy.com/animate.css/ the text of Animate.css changes smoothly and there is no JS there!

Can someone explain to me?

thanks

Answer 1

h1 { color: #f35626; background-image: -webkit-linear-gradient(92deg, #f35626, #feab3a); -webkit-background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: hue 60s infinite linear; } @-webkit-keyframes hue { from { -webkit-filter: hue-rotate(0deg); } to { -webkit-filter: hue-rotate(360deg); } } 

for such markup

 <h1>CHANGE COLOR TEXT</h1> 

Here you can see an example: http://jsfiddle.net/3oqep26z/

Change animation time for faster color changes

Answer 2

I assume it will be with CSS3 I found this online

http://imajineweb.com/csstexthover

Answer 3

These are the functions of css3. Will not work everywhere

Set the animation in some style:

 -webkit-animation-duration: 10s; 

Name him

 -webkit-animation-name: colours; 

And use as you need

 @-webkit-keyframes colours { 0% {background-color: #39f;} 15% {background-color: #8bc5d1;} 30% {background-color: #f8cb4a;} 45% {background-color: #95b850;} 60% {background-color: #944893;} 75% {background-color: #c71f00;} 90% {background-color: #bdb280;} 100% {background-color: #39f;} } 

Example: http://jsfiddle.net/gk37un0r/