Ver Mensaje Individual
  #12 (permalink)  
Antiguo 13/07/2013, 10:39
src
 
Fecha de Ingreso: julio-2013
Mensajes: 11
Antigüedad: 10 años, 9 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. body{
  3. background: #CFF;
  4. }
  5. #imagen {
  6. width: 200px;
  7. height: 200px;
  8. position: absolute;
  9. top: 0px;
  10. left: 0px;
  11. opacity:0;
  12. }
  13.  
  14. #imagen.anim_1 {
  15.    animation: ciclo 50s linear infinite;       
  16. }
  17. #imagen.anim_2 {
  18.    animation: ciclo 50s linear infinite 10s;
  19. }
  20. #imagen.anim_3 {
  21.    animation: ciclo 50s linear infinite 20s;
  22. }
  23. #imagen.anim_4 {
  24.    animation: ciclo 50s linear infinite 30s;
  25. }
  26. #imagen.anim_5 {
  27.    animation: ciclo 50s linear infinite 40s;
  28. }
  29. @keyframes ciclo {
  30.    0%  { opacity:0; }
  31.    5%  { opacity:1; }
  32.    20% { opacity:1; }
  33.    25% { opacity:0; }
  34.   100% { opacity:0; }
  35. }
  36.  
  37. </head>
  38.     <img id="imagen" class="anim_1" src="uno.jpg">
  39.     <img id="imagen" class="anim_2" src="dos.jpg">
  40.     <img id="imagen" class="anim_3" src="tres.jpg">
  41.     <img id="imagen" class="anim_4" src="cuatro.jpg">
  42.     <img id="imagen" class="anim_5" src="cinco.jpg">
  43. </body>
  44. </html>