How to style the ScrollBar using CSS or Javascript?

Question

I want to style the scroll bar, ex: changing its color.
I use this and it does not works.
CSS:

scrollbar-base-color:#369;
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

By the ways, I want the code compatible with cross browsers

Could anyone help please?

The scrollbar is a native GUI widget. Unless you're myspace2, why would you do this to your users? — maček, Apr 11 '15 at 08:46
[link](http://websitetips.com/articles/css/scrollbars/) I got this from the link. — Minh Bang, Apr 11 '15 at 08:51
_“Scrollbar colors show up in Internet Explorer 5.5+. Other browsers will see the default gray scrollbars.”_ — Sebastian Simon, Apr 11 '15 at 08:55
@xufox Thats like saying "If you want to know how to test blood pressure, go to medical school" — Wesley Smith, Apr 11 '15 at 09:08

score 0 · Accepted Answer · edited May 23 '17 at 12:14

This question has been answered already multiple times on SO , here are a few links , that should get you sorted :

Custom CSS Scrollbar for Firefox.

Customize scrollbars using CSS

How can I create custom scrollbar for Mozilla Firefox ith CSS?.

this should get you started. Long story short, a custom css-styled div is used in conjunction with JavaScript to catch click-and-drag events on the custom div. Wired up to these events are methods that scroll the contents of whatever div the custom-scroller has been attached to.

I'm all about the learning experience -- but after you've learned how it works, I recommend using a library (of which there are many) to do it. It's one of those "don't reinvent" things...

the above is a quote from this answer.

but if ur in a hurry and want to skip the learning phase , heres a plugin thats dead simple to use , and must less hassle then its competition .

How to style the ScrollBar using CSS or Javascript?

1 Answers1