• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

150
Vistas
¿Cómo saber cuándo se realiza la precarga de imágenes con javascript?

Según esta pregunta extremadamente popular , precargar imágenes con javascript es tan fácil como:

 function preloadImage(url) { var img=new Image(); img.src=url; }

Pero lo que me gustaría saber es cómo puedes saber cuándo está hecho. Podría simplemente hacer un pequeño setTimeout y asumir que se hará después de un pequeño retraso, pero con velocidades de conexión variables y especialmente para imágenes grandes o grandes cantidades de imágenes, esto no es confiable.

¿Hay alguna forma de saber con certeza cuándo se realiza la carga?

about 3 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

Los elementos de imagen tienen dos eventos a los que te puedes suscribir para saber que la imagen se ha cargado: onload y onerror :

 function preloadImage(url, doneCallback) { var img=new Image(); img.src=url; img.onload = () => { doneCallback(); } img.onerror = () => { doneCallback(new Error('Failed to load image ' + url)); } } preloadImage(url, (err) => { if (err) { console.log(err.message); } else { console.log('Preloading DONE!'); // do what you want after preloading here! } }

O si prefiere Promises (para que pueda usar async/await, etc.):

 function preloadImage(url) { var img=new Image(); img.src=url; return new Promise((done, fail) => { img.onload = () => { done(); } img.onerror = () => { fail(new Error('Failed to load image ' + url)); } }); } async function main () { console.log('preloading image!'); await preloadImage(url); console.log('done preloading image!'); } main().catch((err) => { console.log(err.message); });
about 3 years ago · Juan Pablo Isaza Denunciar

0

Acabo de encontrar la respuesta a mi propia pregunta en los documentos de MDN para la clase Imagen. Hay un atributo booleano complete que te dice si está hecho.

about 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda