当 webkit-scrollbar-thumb 悬停时更改 webkit-scrollbar-track-piece 的颜色？

Question

我有以下 CSS 规则：

::-webkit-scrollbar-thumb:vertical:hover {
    background-color: #666;
}

我还想在 webkit-scrollbar-thumb 悬停时装饰 webkit-scrollbar-track-piece。比如：

//  Doesn't work:
::-webkit-scrollbar-thumb:vertical:hover ::-webkit-scrollbar-track-piece {
    background-color: red !important;
}

这是否可能仅使用 CSS 使用另一个我不知道的表达式？还是目前无法做到这一点？

Answer 1

2019 - 这对我有用（至少在 Chrome 中）可以减轻悬停时的滚动条：

::-webkit-scrollbar:hover {
  background-color: rgba(200,200,200,.1) !important;
}

或者对于特定的类：

.fooClass:hover::-webkit-scrollbar {
  background-color: rgba(200,200,200,.1) !important;
}

（您可以更改颜色/不透明度...）

Answer 2

试试这个：-

::-webkit-scrollbar-thumb:vertical:hover + ::-webkit-scrollbar-track-piece{
    background-color: red !important;
}

或

::-webkit-scrollbar-thumb:vertical:hover ~ ::-webkit-scrollbar-track-piece{
        background-color: red !important;
    }