elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Introducción a Git (Primera Parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  [Resuelto] [Pregunta]: ¿Mostrar pre-loader mientras carga una imagen?
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: [Resuelto] [Pregunta]: ¿Mostrar pre-loader mientras carga una imagen?  (Leído 1,322 veces)
Leguim


Desconectado Desconectado

Mensajes: 699



Ver Perfil
[Resuelto] [Pregunta]: ¿Mostrar pre-loader mientras carga una imagen?
« en: 1 Septiembre 2019, 21:52 pm »

Buenos días!
Anduve buscando la manera de mostrar un pre-loader (gif de carga) mientras una imagen no carga y sólo cuando cargo al 100% mostrar dicha imagen, ya que si no la imagen al cargar la pagina se va a ir mostrando por partes primero muestra la parte de arriba de la imagen y después hacia abajo. Es decir  por trozos y no me gusta como queda eso.

Busque en internet pero me aparecen resultados de como mostrar un pre-loader o gif de carga pero mientras la pagina no cargo completamente. Basicamente es similar pero para las imagenes que llamo a través de php que estan en mi base de datos.

Gracias.


« Última modificación: 9 Septiembre 2019, 20:51 pm por #!drvy » En línea

engel lex
Moderador Global
***
Desconectado Desconectado

Mensajes: 15.514



Ver Perfil
Re: [Pregunta]: ¿Mostrar pre-loader mientras carga una imagen?
« Respuesta #1 en: 1 Septiembre 2019, 22:03 pm »

esto es un poco mas complicado que un simple loader...

tendrías que ir leyendo la trama de bits y mostrandola...

esto dependerá del formato, no necesariamente las imagenes son pixeles en orden, pueden ser tramas interlazadas (ej. donde primero vienen las lineas pares y luegos las impares) pueden ser de resolucion progresiva (la imagen viene en baja calidad y cada lote de bits siguiente le suma calidad) o puede ser por componentes (donde los primeros bits son la luminosidad, los siguientes saturación, tinte y transparencia), incluso puede ser mas complejo (por ejemplo compresion sin perdida, puede necesitar todo el contenido antes de descomprimir, ya que no es un proceso lineal siempre)

asi que tienes que revisar que tus fotos estén en el formato correcto, si lo estan, probablemente el mismo navegador se haga cargo al poner el src en un img


En línea

El problema con la sociedad actualmente radica en que todos creen que tienen el derecho de tener una opinión, y que esa opinión sea validada por todos, cuando lo correcto es que todos tengan derecho a una opinión, siempre y cuando esa opinión pueda ser ignorada, cuestionada, e incluso ser sujeta a burla, particularmente cuando no tiene sentido alguno.
Leguim


Desconectado Desconectado

Mensajes: 699



Ver Perfil
Re: [Pregunta]: ¿Mostrar pre-loader mientras carga una imagen?
« Respuesta #2 en: 1 Septiembre 2019, 22:59 pm »

Era esto lo que quería (pude encontrar algo): https://platzi.com/tutoriales/1099-fundamentos-javascript-2017/1772-pre-cargar-imagenes-con-javascript-gif-preloader-muy-sencillo/

pero esta a medias ya que no se como aplicarlo para imagenes que llamo desde una base de datos con php
En línea

engel lex
Moderador Global
***
Desconectado Desconectado

Mensajes: 15.514



Ver Perfil
Re: [Pregunta]: ¿Mostrar pre-loader mientras carga una imagen?
« Respuesta #3 en: 1 Septiembre 2019, 23:21 pm »

disculpa habia entendido justo lo contrario

para esto es simple basicamente el esquema es (asumiendo que usas jquery)

Código
  1. function cargar_imagen(imagen){
  2.  var contenedor = $("#contenedor_imagen"); //asumiendo que esto es un div con ese id
  3.  
  4.  contenedor.html("<img id='precarga' src='precarga.gif'><img id='nueva_imagen'> ");
  5.  
  6.  $("#nueva_imagen").hide(); //oculto esto
  7.  $("#nueva_imagen").attr('src',imagen); //le paso el link e la imagen
  8.  
  9.  $("#nueva_imagen").on("load", function(){  //cuando la imagen se haya cargado
  10.  
  11.    $("#precarga").hide(); //oculto esto
  12.    $("#nueva_imagen").show(); //muestro la imagen cargada
  13.  
  14.  });
  15. }

no lo probe solo lo hice de mente, puede tener tener algun error, pero en general deberia solucionar tu problema
En línea

El problema con la sociedad actualmente radica en que todos creen que tienen el derecho de tener una opinión, y que esa opinión sea validada por todos, cuando lo correcto es que todos tengan derecho a una opinión, siempre y cuando esa opinión pueda ser ignorada, cuestionada, e incluso ser sujeta a burla, particularmente cuando no tiene sentido alguno.
Leguim


Desconectado Desconectado

Mensajes: 699



Ver Perfil
Re: [Pregunta]: ¿Mostrar pre-loader mientras carga una imagen?
« Respuesta #4 en: 2 Septiembre 2019, 01:35 am »

Gracias!
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Progress Bar mientras Carga Aplicacion
Programación Visual Basic
juanjoxx 2 5,250 Último mensaje 9 Septiembre 2008, 19:11 pm
por byway
mostrar splash mientras carga un formulario
Programación Visual Basic
unish 5 5,509 Último mensaje 11 Abril 2009, 06:40 am
por unish
Mensaje mientras carga PHP
PHP
javirk 3 5,983 Último mensaje 11 Mayo 2012, 21:12 pm
por pwnz
[Resuelto] servidor apache/php no carga archivos php
PHP
gAb1 8 5,434 Último mensaje 20 Diciembre 2014, 03:24 am
por gAb1
Mientras se concretan más detalles, Neymar es ya la imagen de PES 2016
Noticias
wolfbcn 0 577 Último mensaje 13 Junio 2015, 01:45 am
por wolfbcn
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines