Problema precarga ajax

Buenos días. Antes de nada, no se si es problema mio o ya no puedo entrar con mi antiguo name/pass...
A lo que vamos, estoy haciendo una web en la que el contenido se carga por medio de ajax dentro de un div para no recargar toda la página. Lo que se carga básicamente son imágenes, pero no hace bien la precarga, salta la info en el div contenedor pero se ve como se van cargando las imágenes, cuando deberían salir ya cargadas. Mi código ajax:

Código Javascript :

//////////////////////////////////
////////CREA OBJETO AJAX//////////
//////////////////////////////////

function ajaxFunction() 
{
    var xmlHttp;
    try 
   {
      // Firefox, Opera 8.0+, Safari
      xmlHttp=new XMLHttpRequest();
      return xmlHttp;
    } 
   catch (e) 
   {
      // Internet Explorer
      try 
      {
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      return xmlHttp;
      } 
      catch (e) 
      {
         try 
         {
            xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            return xmlHttp;
         } 
         catch (e) 
         {
            alert("Tu navegador no soporta AJAX!");
            return false;
         }
      }
   }
}

//////////////////////////////////
////////FUNCION LLAMADA///////////
//////////////////////////////////

function Enviar(_pagina, capa) 
{
   var ajax;
   ajax = ajaxFunction();

   ajax.open("POST", _pagina, true);

   ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
   
    ajax.onreadystatechange = function() 
   {
      if (ajax.readyState==1)
      {
         document.getElementById('carga').innerHTML = "cargando...";
      }
      if (ajax.readyState==4) 
      {
         if(ajax.status==200)
         {
            alert(ajax.readyState);
            alert(ajax.responseText);
            document.getElementById(capa).innerHTML=ajax.responseText; 
            document.getElementById('carga').innerHTML = "";
            $('#contenido' ).animate({width: anchoCont}, 900 )
            setTimeout(function() 
            {
            $("a#example1").fancybox();
            },1000);
         }
         else if(ajax.status==404)
         {
            document.getElementById('carga').innerHTML = "La página no existe";
         }
         else
         {
            document.getElementById('carga').innerHTML = "Error:".ajax.status; 
         }
      }
   }
          
   ajax.send(null);
}

Alguien tiene idea de que puede pasar?
Muchas gracias
Saludos

Todo está funcionando bien, lo que sucede es que tienes una idea incorrecta de lo que pasa cuando recibes algo con AJAX. Cuando ajax.status == 200 quiere decir que el servidor ya respondió y que la respuesta está en tu poder. En este caso, la respuesta es código HTML que estás insertando en el documento:

Código Javascript :

    document.getElementById(capa).innerHTML=ajax.responseText;

Luego de que insertas el HTML de esta manera, el navegador empieza a cargar los recursos necesarios (img, swf, etc).

Espero me haya hecho entender. Saludos.

Pero entonces este tutorial no tiene sentido, pone que es una PRECARGA EN AJAX
http://www.cristalab.com/tutoriales/precarga-preloader-en-ajax-c178l/

No está mal, todo es correcto a excepción del uso de la palabra "precarga". Está mal usada pues no se está haciendo pre-carga de nada sólo se está haciendo una solicitud al servidor a través del servidor. Igual es un tutorial de hace casi 5 años. Si me das un tiempo podría escribir un tip de cómo hacer precarga real de imágenes. Saludos.

La verdad es que seguro que ha muchos nos vendría genial. Por cierto, se podría hacer lo que yo creía que hacia el tuto? Una precarga, para que se cargara de golpe el contenido al hacerlo con AJAX?
Muchas gracias por la ayuda.
Saludos

Precisamente de eso se trataría el tip.

Amigo, ya lo publiqué en el foro de tips para que revises. Saludos.