¿Cómo haces que una imagen parpadee?

Question

Me preguntaba cómo hacer que una imagen parpadee en CSS, si es posible. Quiero que parpadee donde está.

También me gustaría cambiar la velocidad, pero principalmente quiero hacer que parpadee.

Answer 1

uso del método setInterval de Javascript usarlo como referencia de W3Schools y luego cambiar el css de visibility:visible a visiblity:hidden no vamos a utilizar display:none ya que elimina el espacio de la imagen, así pero necesitamos el espacio para la imagen para que el parpadeo funcione.

Answer 2

¡CSS animaciones al rescate!

@keyframes blink { 
    0% { 
     opacity: 1; 
    } 
    50% { 
     opacity: 0; 
    } 
    100% { 
     opacity: 1; 
    } 
} 
img { 
    animation: blink 1s; 
    animation-iteration-count: infinite; 
} 

http://jsfiddle.net/r6dje/

Se puede hacer un abrir y cerrar aguda mediante el ajuste de los intervalos:

@keyframes blink { 
    0% { 
     opacity: 1; 
    } 
    49% { 
     opacity: 1; 
    } 
    50% { 
     opacity: 0; 
    } 
    100% { 
     opacity: 0; 
    } 
} 

http://jsfiddle.net/xtJF5/1/

Answer 3

usted puede hacerlo con CSS fácilmente. Simplemente agregue a continuación el código de navegador cruzado en el elemento CSS de su imagen. Puede establecer también el tiempo si cambia el dígito en el código.

-webkit-transition:all 1s ease-in-out; 
-o-transition:all 1s ease-in-out; 
-ms-transition:all 1s ease-in-out; 
transition:all 1s ease-in-out; 
-webkit-animation:blink normal 2s infinite ease-in-out; 
-ms-animation:blink normal 2s infinite ease-in-out; 
animation:blink normal 2s infinite ease-in-out;