检查元素是否在clientHeight

Question

我想在页面底部设置一个div。

如果主内容div小于客户端高度，那么它应该出现在页面的底部。

如果content div更大，那么div应该设置在content div下面。

这里有两个图像解释我的问题更好：

可有人告诉我的逻辑是如何做到这一点？

Answer 1

有几种方法可以做到这一点，您寻找一个sticky footer类型，在谷歌，你会得到很多结果。

试试这个：http://css-tricks.com/snippets/css/sticky-footer/

Answer 2

这可以轻松完成。

var winHt = $(window).height(); 
var contentHt = $("#content").height(); 
var footerHt = $("#footer").height(); 

if (winHt >= contentHt) { 
    $("#footer").css("top",winHt-contentHt-footerHt); 
} 

看到这两个演示页： - 案例1：当内容DIV较小然后窗口 - >http://jsbin.com/otulog/2

案例2：当内容DIV较大然后窗口 - >http://jsbin.com/otulog/3