页面底部的浮动 DIV(它不应该在页脚 DIV 之后滚动)

Question

div{
   position:fixed;
   bottom:0px;
   height:20px;
}

上面代码中的

解释了DIV将始终保持在底部。但我需要避免页脚后的滚动。我的意思是需要为浮动div设置边界。

你能帮我吗?

[编辑]请参考并帮助我!http://jsfiddle.net/umarfaruk/y9cWf/我添加了我的样本。如何我可以停止浮动div当我们触摸页脚div。(我的意思是浮动应该在页脚前停止滚动)

更新:

谢谢大家。我在http://jsfiddle.net/PnUmM/1找到了解决方案，真的要感谢@Gatekeeper:)

Answer 1

就像Giberno在他的评论中写的那样，使用空div来填充页脚占用的空间(从而防止最后一行文本被页脚隐藏)。又好又简单:不需要脚本!

div#footer{
   position:fixed;
   bottom:0px;
   height:20px;
}
div#empty-space{
   height:20px; /* Same height as footer */
}

和HTML:

Put your page here
...
<div id="empty-space"/>
<div id="footer">footer</div>

Answer 2

最简单的方法是给body一个底部填充与固定元素相同的高度。这样你就可以滚动到任何内容。

#body {
    padding-bottom: 50px;
}
#fixed {
    height: 50px;
    position: fixed;
    width: 100%;
}

这里有小提琴

Answer 3

在你的页面或样式表中避免在f

后面出现滚动条

* {
 margin: 0 auto;
}