html - 隐藏滚动条的干净方法?

标签 html css

<分区>

请注意,我非常清楚还有其他关于此的 SO 主题。我重新提问的原因是它们中的大多数都已经过时了,所以这些答案仍然适用(基本上只有一个元素有溢出:隐藏,而 child 有溢出:自动和 padding-right 来“隐藏” div (虽然并没有真正隐藏它,但在我看来这根本不是一个干净的解决方案)。是否有更现代的方式来隐藏滚动条,但仍然允许您滚动,而不仅仅是将滚动条 div 扔到看不见的地方,但实际上只是隐藏了滚动条?同样,我知道已经有很多问题了,我只是想真正解决这个问题而不是用创可贴覆盖它(使滚动条看不见) .

最佳答案

在支持 -webkit- 前缀的浏览器中,使用这个 CSS:

::-webkit-scrollbar {
  display:none;
}

或者,如果您希望在特定元素上使用它,请执行以下操作:

element::-webkit-scrollbar {
  display:none;
}

这会隐藏滚动条,但不会阻止它滚动。如果您想完全停止滚动,您可能必须使用 javascript 或只是缩短页面。 Here是一个 fiddle 。选择文本会将其向下滚动,但没有滚动条。

这个想法适用于移动网站,因为触摸屏手机不需要滚动条。

关于html - 隐藏滚动条的干净方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31256507/

相关文章:

javascript - 允许指针(单击)事件通过元素,同时保持滚动功能

python - Pandas read_html 在 Python 中返回具有 NaN 值的列

javascript - 自由职业者的翻转 Angular 代码是什么?

html - 导航栏和内容之间的空间

javascript - 在 ASP.NET MVC C# 中将 if 和 else 放入 Foreach 循环中

javascript - 是否可以相对于非父 div 设置一个 div 位置,或者有更好的方法吗?

javascript - 如何在输入类型数字(angular,js)中显示尾随零

html - 将 div 定位到容器底部

html - 使用 CSS 按比例调整图像大小(警告 : preset max-width/height)

html - 为什么不溢出 :hidden working in IE6?