Foros del Web » Programando para Internet » Jquery »

Efecto de carga con img GIF

Estas en el tema de Efecto de carga con img GIF en el foro de Jquery en Foros del Web. Hola gente, espero esten bien. Quiero saber como hacer un efecto de carga con imagenes. Yo tengo creada una ventana modal que al hacer click ...
  #1 (permalink)  
Antiguo 17/03/2016, 14:05
 
Fecha de Ingreso: agosto-2015
Ubicación: Rosario - Argentina
Mensajes: 424
Antigüedad: 8 años, 8 meses
Puntos: 12
Efecto de carga con img GIF

Hola gente, espero esten bien.

Quiero saber como hacer un efecto de carga con imagenes.

Yo tengo creada una ventana modal que al hacer click en una LI de lista UL me abre dicha ventana y dentro de la misma aparece la imagen seleccionada.

El problema de esta es que por ahi la imagen tarda unos 2 segundos en aparecer (dependiendo del tamaño) y en ese tiempo quisiera aplicar un GIF de carga para que el usuario sepa que la imagen esta cargando.

Espero puedan ayudarme y gracias de antemano.
  #2 (permalink)  
Antiguo 17/03/2016, 14:51
 
Fecha de Ingreso: marzo-2016
Ubicación: Leipzig
Mensajes: 6
Antigüedad: 8 años, 1 mes
Puntos: 2
Respuesta: Efecto de carga con img GIF

Hombre no estoy muy seguro de que si esto te puede ayudar, pero vamos que tiene relacion con tu tema te podria ser util
http://www.jose-aguilar.com/blog/efecto-cargando-con-jquery-ajax/

Espero que te sirva

Última edición por un_amigo_mas; 17/03/2016 a las 14:58 Razón: Fallo de link
  #3 (permalink)  
Antiguo 17/03/2016, 17:45
 
Fecha de Ingreso: agosto-2015
Ubicación: Rosario - Argentina
Mensajes: 424
Antigüedad: 8 años, 8 meses
Puntos: 12
Respuesta: Efecto de carga con img GIF

Cita:
Iniciado por un_amigo_mas Ver Mensaje
Hombre no estoy muy seguro de que si esto te puede ayudar, pero vamos que tiene relacion con tu tema te podria ser util
http://www.jose-aguilar.com/blog/efe...n-jquery-ajax/

Espero que te sirva

Si bien es cierto que podria servir es como crear un retraso intencional y lo que realmente anda buscando es obtener el tiempo real de carga de imagenes, asi el gif no se mostrara siempre por 2 segundos sino que esta varia dependiendo la conexion de internet de cada quien.

Por lo que si mi internet es mas lerdo, entonces tardaria mas el acceso a dicha imagen almacenada en dicho host.

De igual manera agradezco tu respuesta.
  #4 (permalink)  
Antiguo 18/03/2016, 06:25
 
Fecha de Ingreso: marzo-2016
Ubicación: Leipzig
Mensajes: 6
Antigüedad: 8 años, 1 mes
Puntos: 2
Respuesta: Efecto de carga con img GIF

Hey!, Compañero ya has encontrado una respuesta a tu pregunta.? He estado invesitgando del tema y por decirlo asi he encontrado algo que si se ajusta mas a tus requerimientos
  #5 (permalink)  
Antiguo 18/03/2016, 17:12
 
Fecha de Ingreso: agosto-2015
Ubicación: Rosario - Argentina
Mensajes: 424
Antigüedad: 8 años, 8 meses
Puntos: 12
Respuesta: Efecto de carga con img GIF

Hey man.

No, aun no he encontrado una solucion, ya me estoy quemando la cabeza.

Pasame el articulo a ver que tal

Saludos!
  #6 (permalink)  
Antiguo 22/03/2016, 15:27
 
Fecha de Ingreso: diciembre-2012
Ubicación: Murcia
Mensajes: 329
Antigüedad: 11 años, 4 meses
Puntos: 4
Respuesta: Efecto de carga con img GIF

Hola TrinityCore, eso mismo que dices se puede hacer con ajaxStart y ajaxStop,

tan fácil como leer la documentación de jquery

https://api.jquery.com/ajaxStart/
  #7 (permalink)  
Antiguo 29/03/2016, 07:40
 
Fecha de Ingreso: marzo-2016
Ubicación: Leipzig
Mensajes: 6
Antigüedad: 8 años, 1 mes
Puntos: 2
Respuesta: Efecto de carga con img GIF

Hey Que tal lo lamento por tardar tanto en responder pero estaba solucionando algunos asuntos, Man si lo mejor tambien es documentarse bien en el caso, pero tambien, esto fue lo que encontre hace 2 semanas

http://blog.unijimpe.net/precargar-tu-pagina-con-jquery-y-css/

Suerte con tu proyecto Bro!

Etiquetas: efecto, gif, img
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 10:26.