As far as I know, transitions currently work in Safari, Chrome, Firefox, Opera and Internet Explorer 10+.
This should produce a fade effect for you in these browsers:
a {_x000D_
background-color: #FF0;_x000D_
}_x000D_
_x000D_
a:hover {_x000D_
background-color: #AD310B;_x000D_
-webkit-transition: background-color 1000ms linear;_x000D_
-ms-transition: background-color 1000ms linear;_x000D_
transition: background-color 1000ms linear;_x000D_
}
_x000D_
<a>Navigation Link</a>
_x000D_
Note: As pointed out by Gerald in the comments, if you put the transition on the a
, instead of on a:hover
it will fade back to the original color when your mouse moves away from the link.
This might come in handy, too: CSS Fundamentals: CSS 3 Transitions