Animación CSS3 en Internet Explorer 10

[pzin]

Gracias por compartirlo.

Si quieres tener algo más limpio (DRY), podrías usar la misma animación, la misma declaración keyframes, e indicar en cada animación un animation-delay:

Código CSS:

#imagen.anim_1 {
   animation: ciclo 10s linear infinite;      
}
#imagen.anim_2 {
   animation: ciclo 10s linear infinite 10s;
}
#imagen.anim_3 {
   animation: ciclo 10s linear infinite 20s;
}
#imagen.anim_4 {
   animation: ciclo 10s linear infinite 30s;
}
#imagen.anim_5 {
   animation: ciclo 10s linear infinite 40s;
}
 
@keyframes ciclo {
   0%  { opacity: 0; }
   20% { opacity: 1; }
   80% { opacity: 1; }
  100% { opacity: 0; }
}