Phonegap固定頁眉和頁腳

Question

我們正在開發具有固定頁眉和頁腳的Phonegap移動應用程序。 但是如果任何表單元素集中在一起，則整個頁面變得可滾動，頁眉和頁腳會丟失其固定位置。 在Android中，它運行良好但在iOS中我們遇到了這個問題。

---

更新： -

Viewport Meta

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, height=device-height, width=device-width ,target-densityDpi=device-dpi"/>

應用程序標題

<div data-role="header" id ="Top_content" data-position="fixed" data-tap-toggle="false" data-hide-during-focus=""> 
    <div id="jqm-homeheader" class="jqm-homeheader" align="center"> 
        <img src="images/logo.png" align="center"> 
    </div><!-- Logo closes-->
    <div data-theme="c" data-add-back-btn="true" > 
        <div id="search-box1">
            <form action="" onsubmit="custom_search();"> 
                <input type="search" name="search-product" id="search-product" value="" placeholder="Search" style="width:90%;" data-theme="s" />
            </form> 
        </div> <!-- Search Box--> 
    </div>
</div>

Answer 1

這是一個錯誤。 我有同樣的，它很煩人。 在標題頭中添加以下行：

<script>     
$(document).on("mobileinit", function () {
  $.mobile.fixedtoolbar.prototype.options.tapToggle = false;
  $.mobile.fixedtoolbar.prototype.options.hideDuringFocus ="";
});
</script> 

之后添加：

<script type="text/javascript" src="phonegap.js"></script> 

如果你有jquery和jquery mobile，它必須是：

**改變SRC **

<script type="text/javascript" src="phonegap.js"></script> 
<script type="text/javascript" src="js/libs/jquery-1.9.1.min.js" ></script>
<script>     
$(document).on("mobileinit", function () {
  $.mobile.fixedtoolbar.prototype.options.tapToggle = false;
  $.mobile.fixedtoolbar.prototype.options.hideDuringFocus ="";
});
</script>
<script type="text/javascript" src="js/libs/jquery.mobile-1.3.2.js" ></script>  
 <!-- css -->
<link rel="stylesheet" href="js/libs/jquery.mobile-1.3.1.min.css" />