固定侧栏垂直居中

Question

我正在建设的网站左侧有一个固定的侧边栏，位于屏幕中央。滚动页面时，它应始终保持在浏览器窗口的垂直中心。

我怎样才能达到这个效果？有没有纯css / html解决方案？

我考虑过更新侧栏位置onscroll，但随着css顶部位置的更新，它可能会闪烁。还有其他解决方案吗？我真的很想用css做这个，但我不介意jquery会提供我正在寻找的功能。

Answer 1

您可能需要将position: fixed;添加到css中以使其不会移动。

Answer 2

这就是你要找的东西。请注意，移动浏览器会忽略position:fixed，因此您需要使用一些j来使其适用于它们。另外，确保容器的最小高度为200px;

#sidebar
{
    height: 200px;
    position: fixed;    /* Keep in position on scroll */
    top: 50%;       /* push down 50% of container */
    margin-top: -100px; /* bring back up 50% height of this element */
}

#container
{
    min-height: 200px;
    _height: 200px; /* IE6 always acts as though height is min-height unless overflow: hidden */
}