Webkit滚动条动态样式

Question

我目前正在使用Webkit的:: - webkit-scrollbar CSS属性设置滚动条的样式,并希望在mousemove事件上更改这些属性.问题是我似乎无法找到一种动态获取滚动条CSS的方法.

是否可以通过javascript(可能使用jQuery)动态设置webkit滚动条的样式？

Answer 1

这个问题有一个很好的解决方法,您可以为滚动条添加多个具有diffident样式的css类,然后使用Javascript动态更改类.

例:

.red::-webkit-scrollbar  { ... }
.blue::-webkit-scrollbar { ... }

在类之间切换的按钮red和blue:

$("#changecss").on("click", function(){
    $(".red,.blue").toggleClass("red").toggleClass("blue");
});

这是一个工作小提琴:http://jsfiddle.net/promatik/wZwJz/18/

Answer 2

为此，您应该完全替换滚动条。

只需选择为您提供最简单 API 的那个即可。