Añadir un efecto fadeout a mi loader

[hinfra]

Saludos,

Por el momento tengo esto montado: http://www.hectorgarrofe.com/zirconart/

Me funcionan todo a la perfección... y el loading me ha costado lo suyo.

Ahora me gustaría que cuando termina el loading y desaparece, lo haga mediante algún efecto de transición. El loading que tengo es este:

Aquí el DIV que eso para meter el contenido del loading:

Código HTML:

<div id="loading" class="loading-invisible">
  <p>
  <img src="img/loading.jpg" alt="Cargando" title="Cargando"/><br />
  <img src="img/loader.gif" alt="Cargando" title="Cargando"/>
  </p>
</div>
 

Y aquí el código Javascript que ejecuto justo después del DIV:

Código Javascript:

<script type="text/javascript">
  document.getElementById("loading").className = "loading-visible";
  var hideDiv = function(){document.getElementById("loading").className = "loading-invisible";};
  var oldLoad = window.onload;
  var newLoad = oldLoad ? function(){
  hideDiv.call(this);oldLoad.call(this);} : hideDiv;
  window.onload = newLoad;
</script>
 

no se si me he explicado muy bien... Utilizo jQuery y me gustaría agregarla algun efecto tipo

Código Javascript:

$(id).fadeOut(2500);
 

pero no sé donde ponerlo para que funcione corrdctmaente.

Muchas gracias!