Mientras una página espera a ser cargada, porque se realiza una consulta a la Base de Datos, yo quisiera mostrar una imagen Loading,... que indique que se está realizando el proceso (para que el usuario no se canse

Buscando, en internet encontré el siguiente código en dos secciones:
(Este es el Link http://codingforums.com/showthread.php?t=123862)
Esta es una:
Código HTML:
<script type="text/javascript"> function ajaxFunction() { var xmlHttp; try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("Your browser does not support AJAX!"); return false; } } } xmlHttp.onreadystatechange=function() { if(xmlHttp.readyState==4) { document.getElementById("content").innerHTML=xmlHttp.responseText; } } xmlHttp.open("GET","list.php",true); xmlHttp.send(null); } </script>
Yo sé que mientras se consulta la base de datos se puede mostrar un DIV con una imagen dentro del DIV, como esto.
<DIV><imagen> <DIV/>
Código HTML:
<div id="content"> <br/> <br/> <br/> <h1>Loading ... Please wait </h1> <br/> <br/> <img src="../ajax-loader.gif" /> </div>
Como se cuando se completó la consulta a la base de datos, para luego ocultar o desaparecer el DIV con la imagen LOAD y de esta manera mostrarle al usuario los resultados que consultó ???
Agradezco la ayude algunos de ustedes?
Saludos
