html - jqueryを使用せずにCSS3を使用したHTML5でのスムーズなページ遷移

Question

私はモバイルデバイス用のWebページをデザインしています。jqueryが素晴らしいことは知っていますが、使いたくありません。このhttp://jquerymobile.com/demos/1.0a4.1/のようなスムーズなページ遷移を実現したいのですが、jqueryを使用しません。どうすればそれを達成できますか？ページ遷移の間に呼び出されるWebサービスがあるため、遅延が発生します。できるだけスムーズにしたいと思います。

Answer 1

それに直面する：JavaScriptを使用する必要があり、フレームワークなどを使用しないと非常に面倒になります。スムーズなページ遷移を実現するには、次の2つのオプションがあります。

1）サイトを単一のページとして実行します。それはあなたがリンクしているサイトで使われているものです。全体にページ遷移はありません。これはすべて1ページで、コンテンツをアニメーション化し、AJAHを使用して動的にロードするために使用されるクリックイベントがいくつか含まれています。

2）マルチページサイトを実行しますが、ローカルストレージを使用します。ページ数が少なく、それらに必要なリソースをキャッシュします。JavaScriptは、ページが読み込まれるとすぐに実行され、通常のコンテンツがAJAXによって読み込まれて表示されている間、素敵な読み込み画面を描画します。

個人的には、ページの遷移についてはあまり気にしません。それはまさにウェブサイトの仕組みです。このJavaScriptをすべて作成するまでに、jQueryが必要になるため、jQueryにも躊躇しないでください。モバイルサイトの場合でも、ライブラリのサイズはほぼ許容範囲内です（CDNキャッシュコピーを使用できます）。