Как предварительно загрузить изображение большого размера?
У меня есть определенные ссылки, при наведении мыши на эти ссылки, которые я меняю<div> изображение на заднем плане
jQuery я использовал is-
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');
});
}
Он работает нормально, но проблема в том, что когда я запускаю его на серверных изображениях, на изменение уходит 3-4 секунды, но во второй раз, когда я делаю мышь над изображениями, меняются сразу, я думаю, это из-за того, что изображения хранятся в браузере в кэш. Поэтому я добавил один javascript для предварительной загрузки изображений на страницу 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()">
но этот скрипт не решил мою проблему. что мне делать?