Android 2.3 + Phonegap固定定位不起作用

Question

在我的Phonegap应用程序上,我试图找出一个固定的页脚和标题,实际上在Android 4.0中工作得很好.但是在Android 2.3上,即使它看起来没问题,当我开始滚动页眉和页脚时根本不会保持固定,与滚动一起.

相关代码如下:

HTML:

<div class="container-fluid no-padding">
<div id="header">

</div>  
<div class="wrapper">
    <div id="main-content"></div>
    <div id="push"></div>
</div>
<div id="footer" class="main-footer">

</div>

CSS:

html,body,.container-fluid {
    height: 100%;
    font-family: Helvetica !important;
}

#wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    padding-left: 10px;
    padding-right: 10px;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: -20px; /* the bottom margin is the negative value of the footer's height */
    overflow: scroll;
}

#footer, #push {
    height: 20px; /* .push must be the same height as .footer */
    width: 100%;
}

#footer {
    position: fixed;
    z-index: 10; /* Defect #9 */
    margin: 0;
    bottom:0px;
}

#header {
    position: fixed;
    z-index: 5;
    height: 40px;
    background-color: #FFFFFF;
    width: 100%;
    top: 0px !important;
}

#main-content {
    margin-top: 45px;
}

.main-footer {
    background-color: #cf2129;
    color: #FFFFFF;
}

如果它是相关的,我不是在使用jQuery Mobile(我发现的大部分发现者都与之相关),而是使用Twitter Bootstrap.

欢迎任何指导

Answer 1

我发现了,

只需将"user-scalable = 0"添加到元视口标记即可.

网页设计师习惯于使用CSS的位置将元素固定到窗口:固定,但是,在移动浏览器领域,对固定定位的支持远没有那么普遍,而且更加古怪.

资料来源:http://bradfrostweb.com/blog/mobile/fixed-position/

它告诉您需要了解的有关固定元素和移动浏览器的一切:)