jquery - 操纵 jQuery Mobile 页脚的位置

Question

我有一个问题已被查看，但没有对此问题的答案或评论，所以我想我应该尝试简化我的问题。对于那些对我的整体问题感到好奇的人，请参阅链接:Persistent header in jQuery Mobile

无论如何，我的问题是如何强制 JQM 页脚位于顶部而不是底部？这是 JQM 页脚的代码。它在页面转换中保持良好，但它位于页面的底部，我需要它在头部:

<div data-role="footer" data-position="fixed" data-id="navBar" id="navigationBar">
    <img src="images/bgheader.png" />
</div>

我已经在考虑用 Sencha 重建它，但由于我的截止日期是明天，我认为这是不可能的。这个持久 header 是目前唯一缺少的东西(当页面由于某种原因转换时，JQM header 不会保留)。

Answer 1

我也遇到了类似的问题。

就我而言，我希望页脚完全位于页面底部，因此我将页脚 div 包装到一个新的 div 中，定位在我需要的位置。

让代码自己说话:

<style> 
.footer-wrapper {

    position: absolute;
    bottom: 0px;
    width: 100%;
}
</style>

然后

<div class='footer-wrapper'>
    <div data-role='footer' >
        footer content blah blah blah
    </div>
</div>

通过这种方式，您可以自由移动页脚包装器(与其他所有普通 div 一样，不受 jQuery Mobile 的 css 管理)，例如，在您的情况下，您必须删除 bottom: 0px;属性并在 top: -header's height-px;

中更改它

希望对您有帮助!