Foros del Web » Creando para Internet » CSS »

Imagen antes de que carge la web

Estas en el tema de Imagen antes de que carge la web en el foro de CSS en Foros del Web. Hola buenas a todos y muchas gracias lo primero, quiero hacer montar una imagen antes de que se carge mi web es decir que salga ...
  #1 (permalink)  
Antiguo 30/06/2011, 13:49
 
Fecha de Ingreso: junio-2011
Mensajes: 16
Antigüedad: 12 años, 10 meses
Puntos: 1
Imagen antes de que carge la web

Hola buenas a todos y muchas gracias lo primero, quiero hacer montar una imagen antes de que se carge mi web es decir que salga la imagen a pantalla completa y cuando acabe de cargar la pagina que esta imagen desaparezca.
Un saludo y gracias.
  #2 (permalink)  
Antiguo 30/06/2011, 14:09
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 13 años, 8 meses
Puntos: 64
Respuesta: Imagen antes de que carge la web

con javascript se podria lograr, investiga sobre los Eventos onLoad y onUnload
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #3 (permalink)  
Antiguo 30/06/2011, 14:25
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 14 años, 10 meses
Puntos: 269
Respuesta: Imagen antes de que carge la web

suena raro lo que queres hacer (tal vez no se entiende el problema) ya que normalmente se cargará primero lo más liviano y tardarán un poco más las imagenes.
Este trabajo no podrás hacerlo con css sino que deberas usar javascript.
Abajo te dejo unos ejemplos usando jquery una librería de javascript, espero te sirvan.

Este código indica que una vez se ha cargado el documento con imagenes y todo pase a hacer desaparecer la imagen.

Código Javascript:
Ver original
  1. $(document).ready(function(){
  2.       $("#imagen").fadeOut("slow");
  3. });

A lo mejor te sea útil poner una pausa antes de hacer el efecto:

Código Javascript:
Ver original
  1. $.fn.pause = function(duration) {
  2.   $(this).animate({ dummy: 1 }, duration);
  3.   return this;
  4. };
  5.  
  6. $(document).ready(function(){            
  7.     $("#imagen").pause(1000).fadeOut(240); // donde 1000 es igual a 1 segundo.
  8. });
ver el ejemplo (presiona el boton "run" para volver a verlo)

Saludos.

Etiquetas: Ninguno
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 19:17.