如何使用Phonegap + JQuery Mobile启用动画页面转换？

Question

根据JQuery Mobile文档......

  

启用动画页面过渡，指向的所有链接   外部页面（例如products.html）将通过Ajax加载

如果可能的话，在构建一个所有页面都是本地而不是坐在Web服务器上的Phonegap应用程序时，如何启用页面转换？

Answer 1

如果从本地文件或网站加载AJAX，则没有区别（除非您需要将网址列入白名单）。

默认情况下，适用于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>