我在Cordova / PhoneGap应用中创建了一个简单的导航栏菜单(例如此处http://demos.jquerymobile.com/1.2.1/docs/toolbars/footer-persist-a.html)
我已在页面之间添加了幻灯片转换效果,但这种转换在移动设备上非常滞后,您可以看到巨大的峰值并且视图已更改。
此外,虽然在页面之间切换css是"丢失"只需几分之一秒,您就可以看到页面中排列的所有html元素都很奇怪。
我使用三星Galaxy SIII测试应用程序,因此手机具有不错的硬件配置。
这是正常的吗?这可以修复吗?似乎不应该发生什么。
这是我的代码,有两页:
<div data-role="page" id="search">
<div data-role="header" data-id="menu" data-position="fixed" class="ui-header ui-bar-a ui-header-fixed slidedown">
<h1>Search</h1>
<div data-role="navbar" class="ui-navbar ui-mini" role="navigation">
<ul>
<li><a href="#search" data-transition="none" data-icon="grid" data-prefetch="true">Search</a></li>
<li><a href="#favorites" data-transition="slide" data-direction="reverse" data-icon="search" data-prefetch="true" class=" ui-btn-active ui-state-persist">Favourites</a></li>
</ul>
</div><!-- /navbar -->
</div><!-- /footer -->
<!-- CordovaTry references -->
<div data-role="content">content</div>
<div data-role="footer">foot</div>
</div>
<div data-role="page" id="favorites">
<div data-role="header" data-id="menu" data-position="fixed" class="ui-header ui-bar-a ui-header-fixed slidedown">
<h1>Favourites</h1>
<div data-role="navbar" class="ui-navbar ui-mini" role="navigation">
<ul>
<li><a href="#search" data-transition="slide" data-icon="grid" data-prefetch="true">Search</a></li>
<li><a href="#favorites" data-transition="none" data-icon="search" data-prefetch="true" class=" ui-btn-active ui-state-persist">Favourites</a></li>
</ul>
</div><!-- /navbar -->
</div><!-- /footer -->
<!-- CordovaTry references -->
<div data-role="content">content</div>
<div data-role="footer">foot</div>
这是我的包含
<script src="cordova.js"></script>
<script src="scripts/platformOverrides.js"></script>
<script type="text/javascript" charset="utf-8" src="scripts/jquery-1.11.1.min.js"></script>
<script src="scripts/jquery.mobile-1.4.3.min.js"></script>