|
Developers have long whined for the ability to alter the
browser's scrollbar colors, and in IE 5.5 (the latest version of IE as of
Nov 2000), that wish is granted, through, what else, CSS!
The syntax
There are 7 CSS attributes responsible for controlling the
scrollbar's coloring, everything from the background, foreground, to the
little arrow at the two ends of the scrollbar. So without further adieu, here
are our attributes!
| Attributes (move mouse over them for description) |
1)
scrollbar-3dlight-color
2) scrollbar-arrow-color
3) scrollbar-base-color
4) scrollbar-darkshadow-color
5) scrollbar-face-color
6) scrollbar-highlight-color
7) scrollbar-shadow-color
8) scrollbar-track-color
|
|
|
These attributes can be applied not only to the BODY
element, but basically any element on your page that contains a scrollbar
(such as <TEXTAREA>), for refinement. This page would look nice with a gentle greenish
right bar,
wouldn't you say?
<style>
BODY{
scrollbar-face-color:#DFFFBF;
scrollbar-shadow-color:green;
}
</style><BODY>
"
"
</BODY>
|
Scripting
As you can probably tell through the above examples, the CSS
attributes relating to scrollbar coloring are scriptable. The syntax
are simply the attribute themselves, but without the hyphens (-), and the
first letter after the hyphen capitalized. For example:
<script>
//changes color of scrollbar arrows to red
document.body.style.scrollbarArrowColor="red"
</script>
On a compatibility note, IE 5.5+ seems to be alone (at
least for now) in terms of supporting these attributes. Even NS 6 PR3
rejects them. What else is new?
Have fun painting your browser's scrollbars!
TOP BACK Home Page
| 