Cómo cambiar el color de la barra de desplazamiento de la ventana del navegador

Quiero cambiar el color de la barra de desplazamiento de la ventana del navegador, utilicé el siguiente código pero funciona solo en IE8 y no en otros como Chrome y Mozilla .

 html {scrollbar-face-color:#D6D7D6 ; scrollbar-shadow-color: #FFFFFF; scrollbar-highlight-color:#EFEFEF; scrollbar-3dlight-color: #FFFFFF; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #000000;} 

¿Has considerado usar un plugin jQuery ? Como jScrollPane o Tiny Scrollbar .

Como esta pregunta dice:

Los estilos CSS de Scrollbar son una rareza inventada por los desarrolladores de Microsoft. No son parte del estándar W3C para CSS y, por lo tanto, la mayoría de los navegadores simplemente los ignoran.

Recomendaría esos complementos jQuery , ya que son compatibles con todos los navegadores.

Si prefiere no usar un complemento, parece que a partir de 2013, el 70% de los navegadores admiten cierto estilo de barra de desplazamiento. Tal como este código de ejemplo para los navegadores webkit : (es decir, Chrome)

 #doc ::-webkit-scrollbar{width:9px;height:9px;} #doc ::-webkit-scrollbar-button:start:decrement,#doc ::-webkit-scrollbar-button:end:increment{display:block;height:0;background-color:transparent;} #doc ::-webkit-scrollbar-track-piece{background-color:#FAFAFA;-webkit-border-radius:0;-webkit-border-bottom-right-radius:8px;-webkit-border-bottom-left-radius:8px;} #doc ::-webkit-scrollbar-thumb:vertical{height:50px;background-color:#999;-webkit-border-radius:8px;} #doc ::-webkit-scrollbar-thumb:horizontal{width:50px;background-color:#999;-webkit-border-radius:8px;} 

Cada navegador necesita una syntax diferente, aún sugeriría usar un complemento.