仅使用CSS隐藏滚动条的各个部分

Question

我试图隐藏滚动条的特定部分.我的确切要求是隐藏scrollbar-track-piece,但实际srcollbar-thumb可见.(https://css-tricks.com/almanac/properties/s/scrollbar/)

虽然我很确定这是不可能的,但我只是在这里发布这个问题,万一我错了.

我试过pointer-events: none,设置display: none和修改z-index,但似乎都没有工作.如果可能的话,我不想使用JavaScript.

只在Chrome中使用它对我来说已经足够了.(在Electron中尝试这个)

提前致谢!

使用案例:我正在尝试创建一个半原生的半自定义滚动条,其中您可以单击并拖动scrollbar-thumb它以使其表现得像滚动条一样,但是单击该滚动条scrollbar-track-piece是不可能的.我做了一件小事:

Answer 1

您可以使用这些供应商特定的选择器在 Chrome 中轻松地完成此操作。我不确定所有浏览器都支持这一点，但 chrome 确实支持。

   ::-webkit-scrollbar-track { display: none; cursor: none; pointer-events: none }

您可以在此处找到有关滚动条 css 样式所需的所有信息：

https://css-tricks.com/almanac/properties/s/scrollbar/

但是，如果您确实想创建一个适用于所有浏览器的自定义滚动条，您将需要 javascript。目前...