Question

当鼠标在滚动条的顶部和底部（左侧和右侧）移动时，我需要更改滚动条按钮的颜色。如何在WebKit中更改它？当我使用悬停时，它无法正常工作。请帮帮我。

Answer 1

您可能会也可能无法更改滚动条按钮上的悬停样式，因为这取决于浏览器。 ~~即，没有已知的浏览器具有滚动条按钮的悬停样式。~~

编辑： thirtydot指出滚动条按钮悬停样式正在进行WebKit的实现;看他对演示的评论。

Answer 2

您特别说“我如何在webkit中更改它”，所以：

Apple的版本：http://help.apple.com/mobileme/index.html#mm5b08c671

Live Demo（在Chrome中测试过   dev，Safari 5）

一些有用的博文：


http://webkit.org/blog/363/styling-scrollbars/

http://numerosign.com/notebook/styling-webkit-scrollbars-with-css3/

http://almaer.com/blog/creating-custom-scrollbars-with-css-how-css-isnt-great-for-every-task

请注意，以下内容相当耗时：

做对了。
让它看起来不错。

在Apple的帮助网站上看起来非常光滑，因此可能值得付出努力。

Answer 3

所以，可以在滚动条上更改颜色，但你必须考虑到大多数浏览器都不喜欢这些css ..

body {scrollbar-3dlight-color:#ffd700; 
scrollbar-arrow-color:#ff0; 
scrollbar-base-color:#ff6347; 
scrollbar-darkshadow-color:#ffa500; 
scrollbar-face-color:#008080; 
scrollbar-highlight-color:#ff69b4; 
scrollbar-shadow-color:#f0f}

否则，您可以使用Jquery个性化滚动条。请看这个链接：http://www.kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html

如何更改滚动条按钮的悬停颜色？

3 个答案: