jquery - JQuery を使用して、ある div を別の div の上にアニメーション化する

Question

他の多くの投稿を確認したので、他の投稿が私のクエリに答えないため、これは重複していません。私は次のHTMLを持っています:

<div id="page"></div>
<div id="page1">
  <h1>Page One</h1>
  <a href="#" id="topage2">Page 2</a>
</div>
<div id="page2">
  <h1>Page Two</h1>
  <a href="#" id="topage1">Page 1</a>
</div>

JQuery を使用してアニメーション化し、「page2」DIV を上にスライドして「page1」div を置き換えるにはどうすればよいでしょうか。私はもう試した：

var page1 = $('#page1').offset();
var page2 = $('#page2').offset();
page2.top = page1.top;
page2.left = page1.left;

「page1」を「page2」に置き換えることができるかどうかをテストするだけですが、機能しません。明らかに、そのコードは、各ページに移動するためのハイパーリンクが使用する関数、つまり $('#topage1').click などにラップされています...

私が言うように、すでに他のいくつかの質問と回答を見てきましたが、どれも機能していないようで、私が望むことをしているようには見えません。助けてくれてありがとう。