Styling overflow-y scroll bar

Question

I'm using overflow-y: scroll. It gives me the generic system scroll. I can't find anywhere that says how to style this. Is this possible?

Thanks,

Hussein · Answer 1 · 2011-03-05T20:19:40.980

2

Colored scrollbar do not work in Gecko-based browsers (Firefox, Netscape Navigator, Mozilla): It is an Internet Explorer's only property. It is not a standard property or a proprietary property. According to W3C, these properties are illegal: they are neither defined in any CSS specification nor are they marked as proprietary (by prefixing them with "-vendor-")

You need to make your own scroll bars. This can be done using jQuery Slider http://jqueryui.com/demos/slider/#side-scroll.

Also checkout this link http://www.hesido.com/web.php?page=customscrollbar

edited Mar 05 '11 at 20:19

answered Mar 05 '11 at 20:07

Hussein

42,480
25
113
143

also exists some ie style directives that only work in quirks mode – Brandon Frohbieter Mar 05 '11 at 20:10
1

`to style it in Mozilla` - you should change that to "recent WebKit browsers". – thirtydot Mar 05 '11 at 20:11
Edited. It wasn't meant for Firefox. – Hussein Mar 05 '11 at 20:20

score 1 · Answer 2 · edited May 23 '17 at 10:33

1

The easiest way is to use a jQuery plugin called jScrollPane (demos).

A relevant answer I gave about the WebKit scrollbars:

Apple-like scrollbars using CSS

edited May 23 '17 at 10:33

Community

1
1

answered Mar 05 '11 at 20:07

thirtydot

224,678
48
389
349

Styling overflow-y scroll bar

2 Answers2