jQuery가 아약스를 통해 콘텐츠를로드하고 애니메이션을 적용합니다.

Question

아약스를 통해 페이지 콘텐츠를로드하는 중입니다. 이전 콘텐츠가 위쪽 사라짐까지 슬라이드되도록하고 새 콘텐츠를 위치에 배치하고 싶습니다. 내 문제는 내가 볼 수없는 것입니다. 새 내용을 애니메이션으로 만들려면 단추 클릭만으로 렌더링됩니다 (이전 내용은 애니메이션으로 적용됩니다). 다음은 JS 정확히 HTML의 같은 설정을 요청

<div class="content"> 
    <div class="loading"></div> 
    <article id="information"> 
     <header> 
      <h1 class="beta"></h1> 
      <a href="" class="learn">Learn More</a> 
     </header> 
     <section class="advantage"> 

     </section> 
     <section class="advantage"> 

     </section> 
     <section class="advantage"> 

     </section> 
     <a class="next-advantage" id="ajax" href="/logic-combi.php">Logic+ Combi</a> 
    </article> 
</div> 

내 자바 스크립트, 여기

$("#ajax").live("click", function(e){ 
    var loadURL = $(this).attr('href'); 
    $("#information").animate{{positionTop : "-900px" }, 1000); 
    $(".content").load(loadURL + " #information").animate({positionTop: "0px"}, 1000); 
    e.preventDefault(); 
}); 

내 HTML 마크 업되어있다,하지만 <article id="information">

Answer 1

에서 콜백에서 애니메이션을 수행 로드 기능.

$(".content").load(loadURL + " #information", function(){ 
    $('#information').animate({positionTop: "0px"}, 1000); 
}); 

Answer 2

positionTop이 애니메이션에 대한 올바른 paramater하지, 당신은 scrollTop를 사용할 수 있습니다.