Foros del Web » Creando para Internet » CSS »

Imagen de fondo animada

Estas en el tema de Imagen de fondo animada en el foro de CSS en Foros del Web. Como estan? Les vengo a preguntar algo que lo necesito lo antes posible, si es posible (? Necesito crear un bg animado al que le ...
  #1 (permalink)  
Antiguo 05/08/2013, 15:19
 
Fecha de Ingreso: agosto-2013
Mensajes: 6
Antigüedad: 10 años, 8 meses
Puntos: 0
Imagen de fondo animada

Como estan? Les vengo a preguntar algo que lo necesito lo antes posible, si es posible (?


Necesito crear un bg animado al que le voy a dar una property infinite para que siempre se repita, el efecto que quiero lograr es este: (Minuto 5) La espada girando unicamente (El trueno es opcional, si saben mejor), el fog no hace falta:

http://youtu.be/rN8QXJVaSeI?t=5m11s


Gracias
  #2 (permalink)  
Antiguo 05/08/2013, 15:22
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: BG Animado

Pues me parece que si lo quieres hacer en CSS vas a tener que poner varias imágenes de fondo e irlas cambiando, cual GIF animado.
  #3 (permalink)  
Antiguo 05/08/2013, 15:30
 
Fecha de Ingreso: agosto-2013
Mensajes: 6
Antigüedad: 10 años, 8 meses
Puntos: 0
Respuesta: Imagen de fondo animada

En codigo como hariamos esto?
  #4 (permalink)  
Antiguo 05/08/2013, 15:32
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: Imagen de fondo animada

Puedes usar animaciones de CSS: https://developer.mozilla.org/es/doc...nimaciones_CSS
  #5 (permalink)  
Antiguo 05/08/2013, 15:48
 
Fecha de Ingreso: agosto-2013
Mensajes: 6
Antigüedad: 10 años, 8 meses
Puntos: 0
Respuesta: Imagen de fondo animada

Me podrias dar un ejemplo asi random? No logro entender.
  #6 (permalink)  
Antiguo 05/08/2013, 15:50
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: Imagen de fondo animada

¿Qué parte exactamente no logras entender? A ver si la podemos explicar.
  #7 (permalink)  
Antiguo 05/08/2013, 15:55
 
Fecha de Ingreso: agosto-2013
Mensajes: 6
Antigüedad: 10 años, 8 meses
Puntos: 0
Respuesta: Imagen de fondo animada

Yo entiendo que tengo que hacer que aparezca 1 imagen y cambie asi infinitamente, eso no entiendo como se hace
  #8 (permalink)  
Antiguo 05/08/2013, 16:05
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 9.028
Antigüedad: 21 años, 1 mes
Puntos: 1826
Respuesta: Imagen de fondo animada

Haz un gif animado.

Pero tu pregunta suena a cómo haces una espada girando con relámpagos y eso. Eso se hace en un programa de animación 3D.

El como se hace es complejo, tendrás que aprender a usar el programa. Prueba www.blender.org
  #9 (permalink)  
Antiguo 05/08/2013, 16:07
 
Fecha de Ingreso: agosto-2013
Mensajes: 6
Antigüedad: 10 años, 8 meses
Puntos: 0
Respuesta: Imagen de fondo animada

Cita:
Iniciado por Rafael Ver Mensaje
Haz un gif animado.

Pero tu pregunta suena a cómo haces una espada girando con relámpagos y eso. Eso se hace en un programa de animación 3D.

El como se hace es complejo, tendrás que aprender a usar el programa. Prueba [url]www.blender.org[/url]
Tengo la espada en 3d ya echa, necesito saber como crear ese gif y ubicarlo en mi background de la web
  #10 (permalink)  
Antiguo 06/08/2013, 14:10
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 9.028
Antigüedad: 21 años, 1 mes
Puntos: 1826
Respuesta: Imagen de fondo animada

Busca algún programa para convertir digamos un avi a gif: https://www.google.com/search?client...=avi%202%20gif

Al final pones un fondo como

Código CSS:
Ver original
  1. <style>
  2. body {background: url(espada.gif);}
  3. </style>

Etiquetas: animacion, background
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 03:30.