Javascript 更改div的滚动条颜色

我有一个包含许多行的div（thymeleaf cicle），因此我使用滚动条查看所有元素。 现在我想改变这个滚动条的颜色，但我不知道怎么做。我已经阅读并尝试了许多指南，但没有任何结果。 这是我在js文件中的滚动条形码：

$(window).on("load resize",function() {
    winHeight = $(window).height();
    $('#scrollerCa').css({
        'max-height' : (winHeight)-100 + "px",
        'overflow-y' : "auto",
        'overflow-x' : "hidden",
    });
});

有人知道如何改变颜色吗？现在情况很糟糕

---

提前感谢使用这些简单的滚动条CSS属性：

scrollbar-face-color: #000000;  
scrollbar-shadow-color: #2D2C4D;  
scrollbar-highlight-color:#7D7E94;  
scrollbar-3dlight-color: #7D7E94;  
scrollbar-darkshadow-color: #2D2C4D;  
scrollbar-track-color: #7D7E94;  
scrollbar-arrow-color: #C1C1D1;  

当然，你应该把它放在

#yourdiv{}

或

.yourdiv{}

---

选中链接。

使用下面的jQuery CSS属性

$('#scrollerCa').css({
    'max-height' : (winHeight)-100 + "px",
    'overflow-y' : "auto",
    'overflow-x' : "hidden",
    "background-color": "yellow"
});

---

我可以把这个设置放在我的js中吗？因为我已经使用过这个指南，但没有像这样的结果：

$（'scrollerCa'）.css（{'max height'：（winHeight）-100+“px”、'overflow-y'：“auto”、'overflow-x'：“hidden”、'scrollbar face color'：'000000'，}）我试过：$（'#scrollerCa'）.css（{'max-height'：（winHeight）-100+“px”、'overflow-y'：“auto”、'overflow-x'：“hidden”，“scrollbar-face-color:”#1922f8“，“scrollbar-shadow-color:”#1922f8“，“scrollbar-highlight-color:”#1922f8“，“scrollbar-3dlight-color:”#1922f8“，“scrollbar-track-color:”#1922f8“，“scrollbar-arrow-color:”#1922f8“，））；但是滚动条总是一样的