css - 如何根据 PSD 设置 Scroller 的样式

Question

我需要设置自定义滚动条的样式，到目前为止，我还没有得到任何解决方案来达到预期的效果。我尝试使用 ::webkit-scroller 属性，但它不起作用。

Answer 1

请在以下链接上检查此滚动条插件

http://jscrollpane.kelvinluck.com/

http://areaaperta.com/nicescroll/

http://manos.malihu.gr/jquery-custom-content-scroller/

Answer 2

您可以使用 jQuery 插件来做到这一点。

http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html

您需要做的就是将整个代码包装到主容器中，然后对其应用 jQuery 自定义滚动插件并相应地应用您的自定义 css ......你就完成了。

Answer 3

试试这些伪元素和伪类选择器

::-webkit-scrollbar-track-piece:start {
   /* Select the top half (or left half) or scrollbar track individually */
}

::-webkit-scrollbar-thumb:window-inactive {
   /* Select the thumb when the browser window isn't in focus */
}

::-webkit-scrollbar-button:horizontal:decrement:hover {
   /* Select the down or left scroll button when it's being hovered by the mouse */
}