¿Cómo precargar una imagen de gran tamaño?

Question

Jul 21, 2010, 11:41 AM

¿Cómo precargar una imagen de gran tamaño?

Tengo ciertos enlaces, al pasar el mouse sobre esos enlaces que estoy cambiando<div> imagen de fondo

jQuery que he usado es-

function imgchange()
    {
        $('.smenu li').mouseover( function(){
        var src = $(this).find('a').attr('href');
        $('.hbg').css('background-image', 'url(' + src + ')');
        $(this).find('hbg').attr('title', 'my tootip info');
        });     
    }

Está funcionando bien, pero el problema es que cuando lo ejecuto en imágenes del servidor tarda 3-4 segundos en cambiarse con el cambio, pero la segunda vez que hago el mouse sobre las imágenes se cambian instantáneamente, creo que esto se debe a las imágenes almacenadas en el navegador cache. Así que agregué un javascript para precargar imágenes en la página onLoad () ivent -

<script language = "JavaScript">
function preloader() 
{
heavyImage = new Image(); 
heavyImage.src = "images/soluinfo1.jpg";
heavyImage.src = "images/soluinfo2.jpg";
heavyImage.src = "images/soluinfo3.jpg";
heavyImage.src = "images/soluinfo4.jpg";
heavyImage.src = "images/soluinfo5.jpg";
heavyImage.src = "images/soluinfo6.jpg";
heavyImage.src = "images/soluinfo7.jpg";
}
</script>

<body onLoad="javascript:preloader()">

pero este script no ha resuelto mi problema. ¿Qué debo hacer?