javascript - jquery Ajax loading Content animated? -

trying out atm ajax loaded content...

iam done far loading div looks boom here when change ..

so question how can animate slide out div shows content... (this step easy..) when click on next navbarbutton changing content in div changing animated or in way...

here code far

function getpage(id) {  $("#output").slidetoggle("slow");  var mykey = '<?php echo $_session['xxxxxx']; ?>';     $('#output').html('<center><img src="./images/icons/loadericon.gif" /></center>');     jquery.ajax({         url: "./ajax/engine.php",         data:'action='+id+"&userkey="+mykey,         type: "post",         success:function(data){$('#output').html(data);}     }); } 

and here html

<div class="profil_posting_box"> <div  onclick="getpage('textposting');" class="profil_posting_kachel_1"></div> <div  onclick="getpage('imageposting');" class="profil_posting_kachel_2"></div> <div class="profil_posting_kachel_3"></div> <div class="profil_posting_kachel_2"></div> <div class="profil_posting_kachel_2"></div> </div> <div id="output"></div> 

.

do this

jquery.ajax({     url: "./ajax/engine.php",     data:'action='+id+"&userkey="+mykey,     type: "post",     success:function(data){      $("#output").fadeout('slow');      $('#output').html(data);      $("#output").fadein('slow');    } }); 

you may try advanced animation techniques other fadein fadeout using jquery animate