Traer datos desde mysql al cargar pagina

[maxi_lance]

Tengo el siguiente proyecto.. Dos DIV en donde el de la izquierda me muestra los titulos y al hacer click en uno de ellos, me carga en el DIV derecho la imagen correspondiente al titulo elegido.
Ocurre que necesito que al cargarse el archivo php, ya me aparezca alguna imagen determinada en el DIV de la derecha. La imagen tiene que ser tomada tambien de la base de datos.

Código PHP:

  // conexion a la bd // 
 
print "<table border=\"1\" width=\"100%\">\n"; 
print "<tr>\n"; 
print "<td id=\"lista\" width=\"50%\" valign=\"top\">\n"; 
 
print "<table width=\"100%\">\n"; 
while ($row=$mysql->listen()) { 
    print "<tr><td><a href=\"javascript:detalle(".$row[3].");\">".$row[0]."</a></td></tr>\n"; 
} 
print "</table>\n"; 
 
print "</td>\n"; 
print "<td id=\"detalle\" width=\"50%\"></td>\n"; 
print "</tr>\n"; 
print "</table>\n"; 
 
?> 
</body> 
<script language="javascript"> 
function detalle(id) { 
    cargarContenido('detalle.php?did='+id, 'detalle'); 
} 
 
</script>  
  

y el archivo js que linkeo es:

Código HTML:

function Ajax() {
	var xmlhttp=false;
	try {
		xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
	} catch (e) {
		try {
			xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
		} catch (E) {
			xmlhttp = false;
		}
	}
	if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
		xmlhttp = new XMLHttpRequest();
	}
	return xmlhttp;
}
function cargarContenido(pagina_requerida,id_contenedor) {
	var contenedor;
	contenedor = document.getElementById(id_contenedor);
	ajax=Ajax();
	ajax.open("GET", pagina_requerida,true);
	ajax.onreadystatechange=function() {
		if (ajax.readyState==4) {
			contenedor.innerHTML = ajax.responseText;
		} else {
			contenedor.innerHTML = "Cargando...";
		}
	}
	ajax.send(null);
}

y el archivo detalle.php es el que le da formato al DIV de la derecha...


Espero puedan darme una mano en esto ya que encontre este ejemplo en la web y le pude modificar todo lo referido a php y mysql, pero de java nada...