[英]Phonegap + Jquery Mobile Slow Page Transition
當前正在使用Phonegap + Jquery Mobile重建NimbleKit應用,並遇到最基本的問題。 我使用的是多頁設計樣式,只是嘗試在兩頁虛擬內容之間切換,並在下面固定了一個標簽欄。 但是,當我觸摸任一選項卡時,在發生任何事情之前都會有相當大的延遲。 我覺得我可能缺少了一些非常簡單的東西,有人可以看看下面的代碼,讓我知道他們是否發現我做錯了什么?
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.4.0-rc.1.css" />
<title>Demo</title>
</head>
<body>
<script type="text/javascript" src="phonegap.js"></script>
<script type="text/javascript" src="js/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.4.0-rc.1.js"></script>
<div data-role="page" id="one">
<div data-role="header">
<h1>Multi-page</h1>
</div><!-- /header -->
<div data-role="content" >
<h2>One</h2>
<p>This is page one</p>
</div><!-- /content -->
<div data-role="footer" data-position="fixed">
<div data-role="navbar">
<ul>
<li><a href="#one" data-transition="none">One</a></li>
<li><a href="#two" data-transition="none">Two</a></li>
</ul>
</div><!-- /navbar -->
</div><!-- /footer -->
</div><!-- /page one -->
<!-- Start of second page: #two -->
<div data-role="page" id="two">
<div data-role="header">
<h1>Two</h1>
</div><!-- /header -->
<div data-role="content" data-theme="a">
<h2>Two</h2>
<p>Page 2</p>
</div><!-- /content -->
<div data-role="footer" data-position="fixed">
<div data-role="navbar">
<ul>
<li><a href="#one" data-transition="none">One</a></li>
<li><a href="#two" data-transition="none">Two</a></li>
</ul>
</div><!-- /navbar -->
</div><!-- /footer --> </div><!-- /page two -->
</body>
謝謝!
埃利奧特
通常,移動設備操作系統會添加300ms的延遲,以區分抽頭和雙擊。 它等待300毫秒,以查找用戶是否再次點擊以生成雙擊事件。
您可以使用一些類似fastClick的插件來消除此延遲。
同時調整jQM設置。
$(document).bind("mobileinit", function() {
$.mobile.allowCrossDomainPages = true;
$.support.cors = true;
$.mobile.buttonMarkup.hoverDelay = 50;
});
hoverDelay是您應該謹慎處理的。 它取得了不錯的進步。 但是不要通過將其設為0:P來過度使用它
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.