如何使用jquerymobile制作粘性页脚?

时间:2012-06-28 14:13:56

标签: css html5 mobile css3 jquery-mobile

我希望我的页脚始终坚持在屏幕的底部,除非有足够的页面内容填充屏幕的情况下在这种情况下,内容应该优先并将页脚从底部推下(所以你必须滚动才能看到它。)

以下是所需行为的示例: http://ryanfait.com/sticky-footer/

要清楚,我知道fixed toolbars in JQM,它们不是我想要的,因为当有很多内容时它们会占用宝贵的屏幕空间。

3 个答案:

答案 0 :(得分:0)

我最接近的是以下CSS规则:

[data-role=footer] {
    bottom: 0;
    position: absolute;
    width: 100%;
}

如果你知道更好的方法,请发表答案!

答案 1 :(得分:0)

您可以在JqMobile中尝试修复全屏或非全屏但固定的页眉和页脚 ...

在jqMobile中,此功能已添加,并且是webapp开发人员的最具活力的功能 ..

看看它..

Fixed toolbars : JqMobile

您还可以通过添加类来为空间问题应用自定义css ...

答案 2 :(得分:0)

我最好的解决方案:

$(document).ready(function(){
    $("html, body, .ui-page").height($(window).height());
}

希望这有帮助。