使用键盘箭头更改滚动滚动上的滚动背景色

Question

我想使用悬停样式的键盘滚动来更改-webkit-scrollbar-thumb上的滚动

.do-nicescrol{
  height:300px;
  overflow:scroll
}
.container{
  height:1000px
}
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
  opacity: .5;
  position: absolute;
  right: 0;
  box-sizing: content-box;
}

::-webkit-scrollbar-track {
  background: #F4F4F4;
  background-clip: content-box;
}

::-webkit-scrollbar-thumb {
  background-color: #F4F4F4;
  opacity:0;
  background-clip: content-box;
  -webkit-transition: 2s ease-out;
  -moz-transition: 2s ease-out;
  -o-transition: 2s ease-out;
  transition: 2s ease-out;
}
.do-nicescrol:hover::-webkit-scrollbar-thumb {
  background-color: #000;
  opacity:1;
  -webkit-transition: 2s ease-out;
  -moz-transition: 2s ease-out;
  -o-transition: 2s ease-out;
  transition: 2s ease-out;
}

<div class="do-nicescrol">
<div class="container"></div>
</div>