jquery-mobile - Phonegap + JQuery Mobile でアニメーション化されたページ遷移を有効にする方法は?

Question

JQuery Mobileのドキュメントによると...

アニメーション化されたページ遷移を有効にするために、外部ページ (例: products.html) を指すすべてのリンクが Ajax 経由で読み込まれます。

すべてのページが Web サーバー上ではなくローカルにある Phonegap アプリケーションを構築するときに、可能であればどのようにページ遷移を有効にできますか?

Answer 1

AJAX がローカル ファイルまたは Web からロードされている場合、違いはありません (Web でドメインをホワイトリストに登録する必要がある場合を除く)。

デフォルトでは、iOS 用の Phonegap/Cordova は www/index.html からロードされます。

以下は、トランジション用のインライン データ属性を含む 2 ページの例です。

先頭ページ、page1.html

<!-- page1.html -->
...
<div id="page1" data-role="page">
    Local on same page<br/>
    <a href="#samePage" data-transition="pop">same page</a>

    Local in another page<br/>
    <a href="page2.html" data-transition="fade">new page</a>

</div>

<div id="samePage" data-role="page">
    Same Page
</div>
...

別のファイルpage2.html.

<!-- page2.html -->
<div id="page2" data-role="page">
    Page 2
</div>