jquery - jQueryスマホスライドエフェクト

Question

ページに複数の div がありますが、1 つの div を除いてすべて非表示になっています

<div id="main"> ... content ... </div>
<div id="p1"> ...content... </div>
<div id="p2"> ...content... </div>
<div id="p2"> ...content... </div>

<script type="text/javascript">
  $('#p1').hide();
  $('#p2').hide();
  $('#p3').hide();
</script>

メインページには、（たとえば）3つのボタン/リンクがあります。スマートフォン アプリ (メイン ページのボタン/リンクがクリックされたとき) に似たスライド効果を作成したいのですが、メイン div が画面から左にスライドし、関連する div (たとえば p1) が右からスライドします。同時にビューポートに側面を向けます。

これで、メイン div のコンテンツを置き換える (div のコンテンツをスライドさせて、p1 div のコンテンツを div にスライドさせる) か、div 全体を画面外にスライドさせて置換をスライドさせることで、これを行うことができます。 div オン)。

どちらのオプションでも、jQuery でこれを達成する方法がわかりません。

更新：まだ解決策を受け取っていないので、答えを探し続けているので、（自分で注文しただけです）：Building iPhone Apps with HTML, CSS, and JavaScript: Making App Store Apps without Objective -C または ココア. アフィリエイト リンク (Amazon) であることに注意してください (完全開示)。私はこの本を宣伝しているわけではありませんが (まだ読んでいません)、他の人の役に立つかもしれません。

更新 2: アフィリエイト リンクが自動的にアフィリエイト コードに変更されたため、stackoverflow に敬意を表します。:) いずれにせよ、この本が誰かの役に立てば幸いです。私のコピーを受け取るのが待ちきれません。