Foros del Web » Creando para Internet » CSS »

efecto fadein fadeout para background

Estas en el tema de efecto fadein fadeout para background en el foro de CSS en Foros del Web. Estoy buscando la manera de hacer que el fondo la pagina cambie de una imagen a otra de forma automática con un efecto fadein fadeout ...
  #1 (permalink)  
Antiguo 28/11/2014, 15:29
 
Fecha de Ingreso: julio-2009
Mensajes: 117
Antigüedad: 14 años, 8 meses
Puntos: 0
efecto fadein fadeout para background

Estoy buscando la manera de hacer que el fondo la pagina cambie de una imagen a otra de forma automática con un efecto fadein fadeout o similar.

http://css3.bradshawenterprises.com/cfimg/#cfimg3

En el enlace un poco más abajo hace una variante del la demo 3 con múltiples imágenes pero estás no son background, es decir necesitaría hacer ese ejemplo pero siendo background, gracias.
  #2 (permalink)  
Antiguo 28/11/2014, 19:34
 
Fecha de Ingreso: septiembre-2012
Mensajes: 74
Antigüedad: 11 años, 5 meses
Puntos: 4
Respuesta: efecto fadein fadeout para background

Hola Taoshi,

En el link que nos dejas viene completamente explicado como hacerlo, quizá no entiendas ingles, prueba a traducirlo...

Si es algo básico como lo que pides, yo te recomiendo usar CSS para hacer la animación, cómo bien hacen en el link que has pasado.

Lo que hace el codigo número 3 en el html es poner 1 imágenes superpuestas, una justo detrás de la otra, y luego, con css keyframes esconde la imagen 1 para que se muestre la de abajo, y alterna cada 10 segundos.

Es recomendable CSS para animaciones sencillas, pues cargar jQuery solo para esto es una burrada.

Busca información sobre keyframes, que son para realizar animaciones en CSS, y también atento a las compatibilidades con diferentes navegadores de estas.

Un saludo =)

Etiquetas: background, efecto, fadein, fadeout
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:46.