アニメーションを利用したエントランスのデザイン

webページのエントランスについて、下記のようなデザインを行いたいです。

まず、画像のようなループするアニメーションが画面全体に流れていて(デフォルトの状態)、

次に、中心のロゴをクリックすると、ロゴが点滅し、トップページ(画像のような2カラムのもの)に遷移する。

この時、トップページへの移動をリンク(ジャンプ)ではなくアニメーションによる遷移で行いたいのですが、

どのようにスクリプト(あるいは、css)を処理すれば良いでしょうか。

尚、アニメーションによる遷移としては、丸型のパスが出現して中心から画面全体を覆う(パスに設定された色がページの背景色になる)、

というものを考えています。(もっとかっこいいアニメーションがあったら、参考ページなど教えていただけたらありがたいです。)

よろしくお願いいたします。