jquery – 仅当页面为“短”时才将页脚放在底部

我有一个有几页的网站.每个页面都有不同的高度(显而易见,但我提到它).

我想要实现的是,如果页面内容低于浏览器视口,则页脚标记将获得固定位置并将与页面底部对齐.

我试过这个js:

$(function(){
if ($(document).height() > $("footer").offset().top+44) {
        $("footer").addClass('fixbottom');
    }
}
});

$(window).resize(function() {
    if ($(document).height() > $("footer").offset().top+44) {
        $("footer").addClass('fixbottom');
    }
});

那个css:

.fixbottom {
    width: 100%;
    position: fixed;
    bottom: 0;
}


footer {
height:44px;
    background: #7abde9;
    color: #ffffff;
    text-align: center;
}

我的jquery中的前44位是因为我的页脚标记高度为44
iv’e使用文档准备好和窗口调整大小以确保所有情况都应该满足,但不幸的是,这似乎在任何情况下都不起作用.

任何帮助都应该受到极大的关注

解决方法

你不需要javascript.

有一种名为“stickyfooter”的方法,即使没有太多内容,也可以提供一种让页脚始终位于底部方法.

这是一个简单的例子:

html,body {
    height:100%;
}

#wrapper {
    position: relative;
    min-height:100%;
}

#main {
    padding-bottom: 44px;
}

footer {
    height: 44px;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

请参阅此fiddle以了解其工作原理.

相关文章

页面搜索关键词突出 // 页面搜索关键词突出 $(function () {...
jQuery实时显示日期、时间 html: <span id=&quot...
jQuery 添加水印 <script src="../../../.....
中文:Sys.WebForms.PageRequestManagerParserErrorExceptio...
1. 用Response.Write方法 代码如下: Response.Write(&q...
Jquery实现按钮点击遮罩加载,处理完后恢复 思路: 1.点击按...