0

リンクをクリックして別のページに移動するときに、コンテンツの新しいページの左右ワイプまたは左右ワイプを実行できるように、2 つの個別の HTML ファイルを使用して、Webkit ページ アニメーションを作成することは可能ですか? AJAX? 特別な場合のリンクを空想するためのものですか？

そのため、Webkit 対応のブラウザーを使用しているユーザーにとって、リンクは凝ったものになります。ない場合は、通常のリンクのように機能します。

ボーナス -- Mozilla ページ アニメーションでも動作するようになります。

4

2 に答える 2

4
  1. すべての外部リンクを見つける
  2. クリックで...
  3. デフォルトを防ぐ
  4. "leave" のように body 要素にクラスを適用する
  5. そのクラスを使用して CSS でページをアニメーション化します (例: body.leave { transform: translateX: -100%; }
  6. アニメーションが完了すると (CSS アニメーションと同じ時間の setTimeout など)、window.location がリンクの href に移動します。
  7. すべての内部ページで、本文に「プリロード」のデフォルト クラスを設定します
  8. dom ready でそのクラスを削除します
  9. そのクラスを削除すると、「残す」クラスが行う逆のアニメーションが行われるため、ページが所定の位置にスライドします。

このようにする間に、本質的に「白にフェード」する必要がありますが、それに近いです。

于 2012-08-13T16:45:37.777 に答える
2

Ajax を使用しないと、受信ページの HTML を取得できないため、短い答えは「いいえ」です。つまり、受信ページの HTML を取得すると、最新のすべてのブラウザーで純粋な CSS を使用してアニメーションを実行できます。

于 2012-08-13T01:01:58.280 に答える