Posted By

bmayzure on 01/25/13


Tagged

link a color CSS3 transition effect


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

Abiotic


CSS3 Link Color Transition Effect


 / Published in: CSS
 

A simple CSS3 link-color transition effect. Fades from the base color to the active/focus color and back on rollover. A nice little added effect that's pretty well cross browser. Works with Webkit (Chrome/Safari/etc), Opera, Gecko (Firefox/Seamonkey/etc), and IE 10. Degrades nicely for unsupported browsers.

  1. a {
  2. transition: color 0.25s;
  3. -moz-transition: color 0.25s;
  4. -webkit-transition: color 0.25s;
  5. -ms-transition: color 0.25s;
  6. -o-transition: color 0.25s;
  7. /* Fix horrible weird thickness BS */
  8. opacity: 0.9999999;
  9. }
  10. a:link, a:visited{
  11. color:#FF0000;
  12. text-decoration:none;
  13. }
  14. a:hover, a:active, a:focus {
  15. color:#F90;
  16. text-decoration:underline;
  17. }

Report this snippet  

You need to login to post a comment.