仅在滚动到底部时才将页脚固定到底部

Question

我想将我的页脚修复到浏览器窗口的底部，但仅限于用户已经位于页面底部的情况。

如果您在Safari中注意到iOS 8或OS X Mavericks / Yosemite，当您滚动超过页面限制时，会显示更多内容以获得弹性反弹效果。当你有一个固定的标题时，这看起来真的太棒了，它只是在页面顶部上方显示更多背景，而标题是完全固定的，就像在本机应用程序上一样。

但是当你的页脚没有固定到底部时 - 他们必须向下滚动页面才能看到页脚，当用户滚动到底部然后滚动超过该限制时，更多的背景页脚下方会出现颜色，看起来很糟糕。因此，如果我能够在发生这种情况时修复页脚，那么就滚动超过页面限制而言，它的行为与始终固定的页眉完全相同。

这是我想要更改的内容 - 滚动浏览页面末尾后，页脚下方会出现通知白色。如果页脚固定在底部，则不会发生，而是在页脚上方添加空格。

这就是我想要获得的 - 请注意在页脚下方不添加黄色。我想要这样但我不想让页脚始终固定 - 它应该静态定位，以便它们在滚动到底部之前不可见，然后一旦它在底部它应该被固定以获得所需的页面限制滚动行为。当然，向上滚动应该再次静态定位。

JSBin Code

这是position:sticky的工作吗？我更喜欢仅使用CSS而不是JavaScript / jQuery的解决方案。

Answer 1

这应该有用...... !!祝你好运!!

#footer {
position:fixed;
left:0px;
bottom:0px;
height:30px;
width:100%;
background:#999;
}

/* IE 6 */
* html 

#footer 
{
position:absolute;
top:expression((0-(footer.offsetHeight)+(document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight)+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop))+'px');
}