Webkit滚动条动态样式 [英] Webkit scrollbar dynamic styling

问题描述

我目前使用Webkit的:: - webkit-scrollbar CSS属性设置滚动条，并希望在mousemove事件上更改这些属性。问题是，我似乎没有找到一个方法来动态地到达滚动条的CSS。

I'm currently styling the scrollbar using Webkit's ::-webkit-scrollbar CSS properties and would like to change these properties on a mousemove event. The problem is that I can't seem to find a way to get to the scrollbar's CSS dynamically.

是否可以通过javascript动态地调整webkit滚动条使用jQuery）？

Is it possible to style the webkit scrollbar dynamically, through javascript (possibly using jQuery)?

推荐答案

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

There is a nice workaround for this problem, you can add multiple css classes with diffident styles for the scrollbar, and then change the classes dynamically with Javascript.

示例：

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

在红色和蓝色之间切换的按钮：

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

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

Here is a working fiddle: http://jsfiddle.net/promatik/wZwJz/18/

这篇关于Webkit滚动条动态样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！