CSS – Animation with cross browser compatibility.

The Source Code to copy/paste:

.animation:hover {
  -webkit-animation: myanim 5s infinite; /* Chrome, Safari 5+ */
     -moz-animation: myanim 5s infinite; /* Firefox 5-15 */
       -o-animation: myanim 5s infinite; /* Opera 12.00 */
          animation: myanim 5s infinite; /* Chrome, Firefox 16+, IE 10+, Opera 12.10+ */
}

@-webkit-keyframes myanim {
  0%   { opacity: 0.0; }
  50%  { opacity: 0.5; }
  100% { opacity: 1.0; }
}
@-moz-keyframes myanim {
  0%   { opacity: 0.0; }
  50%  { opacity: 0.5; }
  100% { opacity: 1.0; }
}
@-o-keyframes myanim {
  0%   { opacity: 0.0; }
  50%  { opacity: 0.5; }
  100% { opacity: 1.0; }
}
@keyframes myanim {
  0%   { opacity: 0.0; }
  50%  { opacity: 0.5; }
  100% { opacity: 1.0; }
}

My official WebSite >