cargar pagina con preloader visible?

[Jorge Luis]

Estimados colegas..

Tengo un problema en la cual no encuentro la solución ya que al
parecer me crea confunsión de diferentes librerías, pero tecnicamente
lo que he programado funciona bien, pero me interesa de como hacer
visible el preloader mientras carga nueva pagina en un div, mas bien
te envio mi codigo, en resumen tengo tres capas div, la funcion esta
el menu de header interactue con la capa medio, de esta manera va
cambiando con preloader visible, por lo visto similar las paginas que
encontré los siguientes:

- http://www.cloverstudio.es/proyectos (los tres botones q
interactuan)
- http://www.indoorpro.com/ (donde esta los tres imagenes en lado
derecho que va cambiando las noticias)

De las paginas mostradas he investigado en la cual trabajan con las
librerias mootools, effects, prototype, etc.

Mi intencion es hacer que muestre visible cargador y cambie con el
efecto, en la cual me complica colocar la función a mi código.

EN EL MENU :

<a href="javascript:;" onclick="funcion XXXXX()">Inicio</a>

EN LA CAPA MEDIA

<div id="contenedor"> (AQUI APARECE PAGINAS DESDE MENU) </div>

FUNCION JAVASCRIPT

function XXXXXXXX(){
var myurl = 'XXXX';
myRand = parseInt(Math.random()*999999999999999);
var modurl = myurl + "?rand="+myRand;
http.open("GET", modurl, true);
http.onreadystatechange = useHTTPResponse;
http.send(null);
}
function useHTTPResponse() {
var cargando = "<table border='0' align='center' cellpadding='0'
cellspacing='0'>";
cargando += "<tr><td>&nbsp;</td></tr>";
cargando += "<tr><td align='center'>";
cargando += "<img src='images/loading.gif' alt=''>";
cargando += "</td></tr>";
cargando += "<tr><td align='center'>";
cargando += "<font face='verdana' size='1' color='#333333'>";
cargando += "Cargando...";
cargando += "</font>";
cargando += "</td></tr>";
cargando += "</table>";

if(http.readyState == 4) {
if(http.status == 200) {
var miTexto = http.responseText;
document.getElementById('contenedor').innerHTML = (miTexto);
document.getElementById('ocultar').style.display='none';
}
}else{
document.getElementById('contenedor').innerHTML = (cargando);
}
}

El resultado me aparece al cliclear aparace correctamente pero el
cargador se achica por decir una vez q clickea el tamano de diseño se
achica al visualizar el cargador y luego abre el otro contenido de la
misma proporcion.

Espero la respuesta de ustedes,
gracias.
Jorge.