1

我将 jquerymobile 用于 android phonegap 应用程序。我想创建一个贴在屏幕底部的页脚(因此它一直显示),即使您必须在页面上滚动。现在这是工作的一半。当我在模拟器中测试它时,在页面上向下滚动并单击屏幕(用鼠标),标题会跳起来(参见示例:http ://tinyurl.com/pdv6nlp和http://tinyurl.com/p6xycr9

我的代码非常基本:

<div data-role="page" id="blog" style="background-image:url(img/bg_hdpi.png); background-repeat:no-repeat; background-position:top center; background-attachment:scroll; background-color:#d7d8d8;">


<div data-role="content">   
    <div id="contentTXT">
        <div id="outputblog"></div>
        <img src="img/spacer.gif" height="60" width="100">
    </div>  
</div><!-- /content -->

<div data-role="footer" data-position="fixed" >
    <div style="float:left;"><a href="#" onclick="history.back(); return false">back</a></div>
    <div style="float:right;"><a href="#foo" data-transition="flip">home</a></div>
</div>
</div>

有人能帮我吗?

4

3 回答 3

6

如果您使用固定的 css 位置,它将在黑莓、旧 iphone 和旧 android 等旧设备上中断,因此仅适用于 android 4.x。

要正确使用 jquery 移动属性,请在页脚中再添加一个标签以使其固定在屏幕底部。

<div data-role="footer" data-position="fixed" data-tap-toggle="false">
    <div><a href="#" onclick="history.back(); return false">back</a></div>
    <div><a href="#foo" data-transition="flip">home</a></div>
</div>

即使您滚动或点击正文,点击切换也会保留页脚。

于 2013-07-03T07:33:52.783 回答
5

几行 CSS 应该可以解决这个问题:

position:fixed; 
bottom:0;

与您的页脚 div 内联使用:

<div data-role="footer" data-position="fixed" style="position:fixed;bottom:0;">
于 2013-07-02T16:48:38.460 回答
2

如果使用 1.1 或更高版本,请将 data-tap-toggle="false" 添加到您的页眉和页脚,如此处所述。

于 2015-03-16T09:08:50.133 回答