javascript - 如何将滚动条添加到仅在悬停时出现的固定侧边栏

Question

我正在一个网站上工作，我将侧边栏固定在左侧并使用此 CSS 扩展到页面的整个高度：

sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
}

这可以很好地保持侧边栏就位，但问题是当页面重新调整到较小的高度时，您只能看到侧边栏顶部的东西，而无法看到底部的东西的侧边栏。

现在，我知道我可以添加一个滚动条，overflow-y: scroll;但我想要做的是有一个滚动条，只有当侧边栏上的内容超过窗口的高度并且只出现在悬停时才会出现。我还希望滚动条有一些样式，类似于TheNextWeb上的侧边栏或 Facebook 聊天侧边栏。

我知道我需要一些 JavaScript 才能做到这一点，但我在 JavaScript 方面的技能非常有限，所以我很感激任何帮助。

score 4 · Accepted Answer

overflow-y: auto应该管用：

对于样式，您可能应该搜索一个好的滚动条替换，因为滚动条样式仅适用于 webkit ( http://css-tricks.com/custom-scrollbars-in-webkit/ )。这不是一件小事，但幸运的是有一些插件：

仅举几例。

编辑： 感谢sheba，我做了一些修改：

.sidebar:hover{
   overflow-y: scroll;
}

1 回答 1