Some newer browsers allow you to change the scrollbar by color and position. Most of this is supported by the IE browser only.

There are seven parts to a scrollbar:

  1. normal
  2. face
  3. shadow
  4. highlight
  5. 3dlight
  6. darkshadow
  7. track
  8. arrow

Using CSS, you can apply colors to the different parts like so...

That example would turn the whole scrollbar red, so be sure to adjust the color codes to suit your site designs.

Considering this is "proprietary" coding, it will not validate agains the W3C structure. To create a workaround to this, you will have to use a bit of javascript.

Some sites with different languages need the scrollbar to appear on the left side of the window instead of the right side. This is possible by adding this to your css area...

Now that does have a small drawback in that it will turn things a bit backwards for the stuff on your webpage as well. To counter-act the effect in you normal page area, but keep the scrollbar on the left side, add one more line to your css area...

Table of Contents