检查元素是否在clientHeight中

Question

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

如果主要内容div小于客户端高度，则它应显示在页面底部。

如果内容div较大，则div应设置在内容div之下。

以下两张图片可以更好地解释我的问题：

有人可以告诉我逻辑怎么做吗？

Answer 1

有几种方法可以做到这一点，你在google中寻找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较小时，窗口 - ＆gt; http://jsbin.com/otulog/2

案例2：当内容div较大时，窗口 - ＆gt; http://jsbin.com/otulog/3