martes, 24 de junio de 2014

La precarga de imágenes y el problema inicial

Describiremos la motivación para poder hacer una precarga de imágenes y como el código que se suponía correcto no realiza la precarga correctamente.

Personalmente me enfrenté al problema de precarga de imágenes en la web al crear una página en la que, por diversas razones, se debían cargar un número considerable de imágenes estáticas y otras para uso en eventos de Roll-Over. La página además debía aparecer en una ventana maximizada del navegador (sin barras de scroll,de navegación,de direcciones,etc) para poder apreciar un fondo de 800x600 píxeles. Para hacer ésto, desde la primera página que se carga (página A) se declara un un window.open con el atributo FULLSCREEN=YES que muestra nuestra verdadera ventana principal maximizada (página B). 



Para que A no se quedara como página vacía pensé en utilizarla para precargar ahí los gráficos que B emplearía.

 El problema 

Al cargarse B a partir de A teóricamente todos sus gráficos debían aparecer al instante en pantalla, pero ésto no sucedía así. El código básicamente era: 


 CóDIGO 1 

<HTML> 
<!-- Esta es la página A que debía precargar las imágenes que se usan en B --> 
<HEAD> 
<TITLE>Cargando...</TITLE> 
<SCRIPT TYPE="text/javascript"> 

function cargaImagen(arg) { 
if (document.images) { 
    document.write("Cargando imagen: " + arg + "...<br>"); 
    rslt = new Image(); 
    rslt.src = '"'+ arg +'"'; 
    document.write("\t cargada con éxito<br>"); 
    return rslt; 



if (document.images) { 
    imagen1=cargaImagen("imagenes/pedazo1.jpg"); 
    imagen2=cargaImagen("imagenes/pedazo2.png"); 
    imagen3=cargaImagen("imagenes/pedazo3.jpg"); 
    imagen5=cargaImagen("imagenes/pedazo5.jpg"); 
    imagen6=cargaImagen("imagenes/pedazo6.png"); 
    imagen7=cargaImagen("imagenes/pedazo7.png"); 
    imagen8=cargaImagen("imagenes/pedazo8.jpg"); 
    imagen9=cargaImagen("imagenes/pedazo9.jpg"); 
    document.write("CARGA TERMINADA"); 


<-- Aquí abrimos la ventana maximizada B que es nuestra verdadera página de inicio en la web --> 

privenmax=window.open('inicio.html','principal','fullscreen=yes'); 
</SCRIPT> 
</HEAD> 
<BODY> 
</BODY> 
</HTML>


FIN DE CÓDIGO 1 

RESULTADO: Sale 1 ventana maximizada (inicio.html) que carga las imágenes como siempre, y lo que es más, la primera ventana en la que con document.write se indica qué imágenes se han ido cargando queda minimizada en la barra de tareas, con lo cual no se ve.



Si quieres seguir aprendiendo con nosotros, puedes ingresar a nuestros cursos de Programación visita www.uneweb.com para más información.
Fuente:enlace

No hay comentarios:

Publicar un comentario

Entradas populares