jQuery的Ajax加載內容動畫？

Question

使用Ajax加載的內容嘗試atm東西...

我到目前為止已經完成了將其加載到div中的操作，但是當我更改它時，它看起來像是BOOM。

所以我的問題是我該如何動畫化它，使其滑出Div，然后顯示內容...（此步驟很容易..），但是當我單擊下一個NavbarButton時，其在Div中更改的內容正在更改動畫或以這種方式...

到目前為止，這里是我的代碼

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);}
    });
}

而這里的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>

。

Answer 1

像這樣做

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');
   }
});

您可以嘗試使用jani animate進行除fadeIn fadeOut之外的高級動畫技術