我有几个元素overflow: auto
。它工作很好。在macOS上,滚动条在用户不滚动时自动隐藏并显示在滚动条上。如何自动隐藏Windows浏览器上的滚动条
在窗口和任何浏览器上,滚动条总是可见的。它做了一个丑陋的渲染。
那么当用户不滚动时,如何在每个操作系统和每个浏览器上自动隐藏滚动条?
我知道有很多类似的问题,但我还没有找到一个合适的答案
我有几个元素overflow: auto
。它工作很好。在macOS上,滚动条在用户不滚动时自动隐藏并显示在滚动条上。如何自动隐藏Windows浏览器上的滚动条
在窗口和任何浏览器上,滚动条总是可见的。它做了一个丑陋的渲染。
那么当用户不滚动时,如何在每个操作系统和每个浏览器上自动隐藏滚动条?
我知道有很多类似的问题,但我还没有找到一个合适的答案
我发现了一些东西!我从来没有想过这可能是如此简单:
.my-elem {
overflow: hidden
}
.my-elem:hover {
overflow: auto
}
<style type="text/css">
body {
overflow:hidden;
}
</style>
上面的代码隐藏水平和垂直滚动条。
由于每个浏览器都有自己默认的“用户代理”的样式表,你可能需要做一个CSS重置是重置所有的HTML元素一致的基准的造型。那么你的HTML在所有浏览器上都会显示相同。您也可以标准化。 Normalize.css保留有用的默认值,而不是“不重叠”的所有内容。
我认为这取决于浏览器如何处理滚动条,并且您可以做的事情不多。唯一真正的crossbrowser解决方案是用JS编写自己的滚动条。 –
这是否给你可以使用的东西:https://stackoverflow.com/q/3296644/125981 –