Custom styled scrollbar for overflow areas using CSS

Question

What is the most effective way to have scrollbars on a website to a custom style using CSS?

I'm talking about scrollbars within a DIV with overflow: scroll; set and not on the browser window maybe using a JPG as the scrollbar design.

Hope this explains what I'm trying to achieve.

Thanks

kumiau · Accepted Answer · 2012-10-14 13:09:40Z

3

The scrollbar is a component of the OS, so the browser doesn't give you any liberty for styling it. The best alternative is using Javascript, there are some good libraries for custom scrollbars, Tiny Scrollbar, for example.

answered Oct 14, 2012 at 13:09

kumiau

7343 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Giona · Accepted Answer · 2012-10-14 13:13:31Z

2

At the moment you can redraw scrollbars with pure CSS only on webkit browsers:

http://css-tricks.com/custom-scrollbars-in-webkit/

For other browsers you've to use workarounds, using javascript to emulate the scrolling effect. Some resources:

answered Oct 14, 2012 at 13:13

Giona

21.2k5 gold badges60 silver badges68 bronze badges

Collectives™ on Stack Overflow

Custom styled scrollbar for overflow areas using CSS

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related