Tema: Animación CSS3 en Internet Explorer 10
Ver Mensaje Individual
  #12 (permalink)  
Antiguo 13/07/2013, 10:39
src
 
Fecha de Ingreso: julio-2013
Mensajes: 11
Antigüedad: 11 años, 4 meses
Puntos: 1
Respuesta: animacion css3 en internet explorer 10
Nuevamente gracias pzin por tomarte el tiempo para corregir mis errores y ayudarme a aprender. Aquí dejo el código más limpio, tal y como me sugeriste.

Código HTML: 
Ver original
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. body{
  6. background: #CFF;
  7. }
  8. #imagen { 
  9. width: 200px;
  10. height: 200px;
  11. position: absolute;
  12. top: 0px;
  13. left: 0px;
  14. opacity:0;
  15. }
  16.  
  17. #imagen.anim_1 {
  18.    animation: ciclo 50s linear infinite;        
  19. }
  20. #imagen.anim_2 {
  21.    animation: ciclo 50s linear infinite 10s;
  22. }
  23. #imagen.anim_3 {
  24.    animation: ciclo 50s linear infinite 20s;
  25. }
  26. #imagen.anim_4 {
  27.    animation: ciclo 50s linear infinite 30s;
  28. }
  29. #imagen.anim_5 {
  30.    animation: ciclo 50s linear infinite 40s;
  31. }
  32. @keyframes ciclo {
  33.    0%  { opacity:0; }
  34.    5%  { opacity:1; }
  35.    20% { opacity:1; }
  36.    25% { opacity:0; }
  37.   100% { opacity:0; }
  38. }
  39.  
  40. </style>
  41. </head>
  42. <body>
  43.     <img id="imagen" class="anim_1" src="uno.jpg">
  44.     <img id="imagen" class="anim_2" src="dos.jpg">
  45.     <img id="imagen" class="anim_3" src="tres.jpg">
  46.     <img id="imagen" class="anim_4" src="cuatro.jpg">
  47.     <img id="imagen" class="anim_5" src="cinco.jpg">
  48. </body>
  49. </html>