JQuery, carga de html + preload

[pr0]

Hola muy buenas a todos, espero que podais ayudarme.

Basicamente acabo de empezar con esta libreria y me esta resultando un poco dificil cogerle el hilo.

Lo que necesito es que desde un boton pido la carga de un archivo HTML el cual alojo en un DIV:

Código:

$('#boton_cargar').click(function(){
     $("#seccion").load("secciones/empleo.html");
});

Y tambien tengo este otro codigo para mostrar el mensaje de carga:

Código:

$('#loading')
	.hide()  // hide it initially
	.ajaxStart(function() {
		$(this).fadeIn('slow')
		$(this).animate({opacity: 1.0}, 3000)
	})
	.ajaxStop(function() {
		$(this).fadeOut('slow', function() {
	    	$(this).remove();
    	});
});

El problema es que cuando pulso el botón, se hace el LOAD y el HTML nuevo se muestra correctamente en el DIV lo que pasa que todo esto ocurre en cuestion de milesimas de segundo y el mensaje de LOADING queda en pantalla a pesar de que el HTML ya está cargado.

Alguna sugerencia de que podria hacer?


Gracias y saludos!

[stock]

en esta linea

$("#seccion").load("secciones/empleo.html");

agregale un callback, asi:

Código PHP:

  $("#seccion").load("secciones/empleo.html",function(){
        $('#loading').fadeOut('slow', function() {
            $(this).remove();
        });
}); 
   

saludos

[pr0]

graciassssss ya funciona :P