Why doesn't keyframe animation for link color work in Chrome?

Question

Using @keyframes (and animation ) to animate color a does not work in Chrome.

Demo: https://jsfiddle.net/ed3pypwr/
In Chrome, the connection remains blue. In Firefox, it goes from red to green, as expected. On a div it works fine in Chrome too.

Is there any way to solve this?

EDIT
I know that for maximum compatibility there should be a -webkit- prefix, but this is not a problem here. It still doesn't work.

EDIT 2
The solution would be to put the link in the shell and use currentColor : https://jsfiddle.net/b84gttu6/ . Is there a better way?

Answer 1

In older versions (<43) of Chrome, use the @-webkit-keyframes prefix instead of the standard @keyframes . Thus, full support would look like this:

 @-webkit-keyframes test { from { color: red; } to { color: green; } } @keyframes test { from { color: red; } to { color: green; } } 

Update

I have done several tests with various different methods, and it only works if the link has not been visited (why, I don't know).

Example