Во-первых, rollover'ы можно делать разными способами: можно в css "двигать" полную картинку, можно её в css "подменять" по a:link -> a:hover, а можно делать подмену JavaScript'ом по событию onMouseOver. Поэтому "делаю с помощью rollover" не говорит ничего.
Во вторых. Если Вы не хотите картинку "двигать" в css (что, ИМХО, вариант лучший и работающий независимо от включения/выключения JavaScript etc), предзагрузку картинок можно сделать JavaScript'ом. Примерно так: внутри head загружаете JavaScript с функцией предзагрузки, а на событие onload элемента body вешаем вызов самой функции. Пример ниже:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Preloading of images</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_preloadImages() {
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
</script>
</head>
<body onload="MM_preloadImages('/templates/template_name/images/first.gif','/templates/template_name/images/second.gif')">
</body>
</html>