はフェードアウト、現在のページとslideDown jQueryの負荷

Question

Qと次のページ遷移効果を作成する方法：私はボタンをクリックしたときにどのように私は、次のページでフェードアウト現在のページとslideDownを作ることができます。私はページ遷移fadeOutホームページを作成し、新しいページをロードしてから、次のページを "カーテン"のようにslideDown（）したいと思います。私はそれをfadeOutとfadeInに得ることができますが、どういうわけか私は次のページをslideDownにしてみるとうまくいきません。私はあなたのCSSスタイルは、slideDownにするための要素を非表示にする必要があることを理解しましたが、私はボット「表示：なし」しようとしたトランジションslideDown効果を呼び出す前に、しかし、運にと「非表示を（）」。

私の現在のソリューション：

（ホームページ）：

<div id="content"> 
<a class="btn btn-1 btn-1a about" href="about.php" id="aboutbtn">About me</a> 
</div> 

（Aboutpage）：

<div class="aboutbg"> 
<a class="btn btn-2 btn-1b about" href="home.php" id="backbtn">Back</a> 
</div> 

JS：

$('#aboutbtn').click(function(){ 

    $('body').fadeOut(function() { 
     $(this).load('about.php').fadeIn(); 
    }); 

    return false; 

}); 

作るために別の解決策がありますこれは起こるか、または追加する私の現在のものへの移行。私は何が欠けていますか？

これは、私はそれが私の問題を説明し見つけることができる最も近いインスピレーションサイトです：

http://www.nicolasdesle.be/ - 私 - 約上をクリックします。

お困りですか？ただ聞いてください！

おかげで、事前に、 /// E！

Answer 1

あなたが

.aboutbg{ 
      display: none; 
     } 

が続いているdiv要素にフェードアウトを実行するためにスクリプトを変更するには、jQueryの負荷を経由してロードされたコンテンツを非表示にするには、あなたのホームページにあなたのcode.Add CSSに2つの変更を加える必要がありますコンテンツを取得しました。

$('#aboutbtn').click(function() { 
$("#content").fadeOut(500,function(){ 
    $('body').load('about.php', function() { 
    $(".aboutbg").slideDown(1000); 
}) 
}); 

return false;});