Question

我很难完成我想做的事情，我开始怀疑它是否可能。基本上，我有三个divs，每个divs的宽度取决于你所悬停的那个（简单过渡）。这些overflow-y: scroll的高度始终等于浏览器窗口的100％高度，使用jQuery计算。

我使用::-webkit-scrollbar { display: none; }来完成可滚动内容的多个部分。但是，它看起来很狡猾地包括三个滚动条，所以我试图摆脱它们。在chrome上，它很简单，我只使用overflow: hidden，但对于其他浏览器，它并不那么简单。其他问题已经回答说我需要将我的内容包装在具有{{1}}的div中，但如果没有所有这些转换完全失败，我就无法完成这项工作。

这是我所谈论的demo。提前谢谢！

Answer 1

overflow-y：hidden将隐藏滚动条，如果将其设置为滚动：只有当用户将鼠标悬停在每个面板上时，您仍然可以滚动它：

.panel {
    overflow-y: hidden;
}
.panel:hover {
    overflow-y: scroll;
}

之前的示例缺少默认隐藏，这将阻止面板滚动回顶部。

Answer 2

您可以在悬停时显示滚动条

#container .display-panel:hover {
     overflow-y: scroll;   
}

从显示面板http://jsfiddle.net/9T7ex/1/

中删除overflow-y

隐藏多个滚动条CSS所有浏览器

2 个答案: