Pick up HTML with jQuery when pressing button

Question

I have a simple system that takes the HTML of a file and puts it in a index unique and dynamic. Example:

<a onclick="carregar('cartaonatal/natal.html');" href="#">Agradecimento</a>

//chama a função

function carregar(pagina){
    $("#conteudo").load(pagina);
}

The loaded HTML is placed inside the div #conteudo. What I wanted was for you to carry one load or print in the div with some simple visual animation.

That’s possible?

Answer 1

You can use .fadeOut with callback, and then with .fadeIn() of the element itself with another callback of .load():

function carregar(pagina){
   $('#conteudo').fadeOut(function(){
       $(this).load(pagina, function(){
           $(this).fadeIn();
       });
   });
}