forzar carga de img

[Blashak]

Buenas,

Tengo un menu con 2 opciones (inicio y contactar) que al poner el puntero sobre cada uno cambia la imagen.
El problema es que cuando la web no esta en cache y me pongo encima de uno tarda en cargar la imagen y se ve en blanco durante un rato.
hay alguna forma de que se cargue todo al principio para que depsues no las tenga que cargar.

saludos

[IsaBelM]

puedes hacer una precarga de imágenes o, por esta opción es por la que me decanto usar css sprites

[Blashak]

Iniciado por IsaBelM

puedes hacer una precarga de imágenes o, por esta opción es por la que me decanto usar css sprites

lo que yo me referia es que automaticamente cuando cargue toda la web se descargue las imagenes sola para depsues no tener que descargar una una cuando este encima con el raton.

[_cronos2]

Puedes poner un div que tape la pantalla mientras carga la página, y en el onload lo quitas.
Saludos (:

[Blashak]

Iniciado por _cronos2

Puedes poner un div que tape la pantalla mientras carga la página, y en el onload lo quitas.
Saludos (:

eso es lo que hice. y se cierra el div automaticamente cuando termina de cargar todo el body. el problema esta que las imagenes que no usa no las carga y claro cuando yo me pongo encima del menu por ejemplo inicio tarda 5 segundos en cargar la imagen y mientrastanto se ve en blanco.
Enonces mi idea era cargar todas las imagenes antes de hacer cualqueir cosa para despues ....

No se si alguien sabe alguna forma

Saludos

[_cronos2]

Pues haz algo como:

Código HTML:

<div id='precargar'>
 <img src='imagen1.jpg' alt='' />
 <!-- ... -->
</div>
 

Código CSS:

#precargar { display:none; }
 

Saludos (:

[IsaBelM]

Iniciado por Blashak

Buenas,

Tengo un menu con 2 opciones (inicio y contactar) que al poner el puntero sobre cada uno cambia la imagen.
El problema es que cuando la web no esta en cache y me pongo encima de uno tarda en cargar la imagen y se ve en blanco durante un rato.
hay alguna forma de que se cargue todo al principio para que depsues no las tenga que cargar.

saludos

creo que no le has prestado mucha atención a las ligas que te proporcioné. lo que estás buscando es hacer un rollover con css sprites o si no, has de usar una precarga de imágenes

[InKarC]

Cronos tiene la idea correcta, aunque me parece que algunos navegadores no intentan cargar si esta en display:none el div; asi que mejor seria hacer algo asi en el CSS:

Código CSS:

#precargar { 
overflow:hidden;
 width:1px;
 height;1px;
 position:absolute;
 bottom:1px;
 right:1px;  }
 

[IsaBelM]

Iniciado por InKarC

Cronos tiene la idea correcta, aunque me parece que algunos navegadores no intentan cargar si esta en display:none el div; asi que mejor seria hacer algo asi en el CSS:

Código CSS:

#precargar { 
overflow:hidden;
 width:1px;
 height;1px;
 position:absolute;
 bottom:1px;
 right:1px;  }
 

puedes explicar esta lógica?? no la comprendo. a no ser que hagas una precarga, el navegador únicamente cargará aquellos elementos que estén en el html. y como su propósito es hacer un rollover ....

[InKarC]

Iniciado por IsaBelM

puedes explicar esta lógica?? no la comprendo. a no ser que hagas una precarga, el navegador únicamente cargará aquellos elementos que estén en el html. y como su propósito es hacer un rollover ....

En un div #precargar (que sera invisible para el usuario) colocas todas las imagenes que necesitas "precargar"; así que cuando el navegador las solicite para un rollover o para lo que sea el navegador las va a encontrar en su propio cache, asi que no necesitara cargarlas nuevamente

[IsaBelM]

me parece interesante esa propuesta, así te evitas usar javascript