HomeMadeHTML colored scroll bars

HTML Recipes

Graphics

Image Formats
Convert Images
Embed Watermark
Favicons
Mouse Trails
Cursors
Page Drifters
Clipart

Downloads

Hey ! How do you get the colored scroll bars on the side and bottom?

The colored scroll bars are a feature of INTERNET EXPLORER. They are a CSS (cascading style sheet item) and can be done separately. You will not see them on Netscape, some new versions of Opera and many new browsers support CSS, but not all CSS options. You can use a full css file to specify colors and layout or just paste the elements inline.....

The easiest way to "pick" the colors to use, is to just reuse your body, text, and link colors. You can use color catchers or charts to find and pick your colors.

Where the code shows a # that is a color, #FFFFFF is white, #000000 is black. The sample code below is the one used on this site.

Just copy and paste the code, and place before the </head tag in your code, edit your colors and have fun.

<STYLE type="text/css"> body { scrollbar-arrow-color: #FFFFFF; scrollbar-base-color: #00FF00; scrollbar-dark-shadow-color: #3D86A9; scrollbar-track-color: #FFFFFF; scrollbar-face-color: #9A8AED; scrollbar-shadow-color: #3D86A9; scrollbar-highlight-color: #3D86A9; scrollbar-3d-light-color: #3D86A9; } </STYLE>

There are tools/ small downloads out there as well that will help you create a colored scroll bar. Scroll Bar skinner, TopStyle CSS tool, and Cool Web Scrollbars are three great tools.

An example to help you edit your own scroll bars. some scroll scripts may vary with the elements included.... ~ try a wild bold color to help you see exactly where that element ends up.

arrow color

face color

highlight color

3d color

shadow color

dark shadow color

track color

#FFFFFF -white

#0000A0 - blue

#FFFFFF - white

#00FF00 - light green

#FF8000 - orange

#FF0000 - red

#FFFF00 - yellow

Have fun! ~ Want a flashing scroll bar?

Who is HomeMade? Meet Sugz, Lexsis, Nhyrvana, Shear, and E2C.

Beyond Building: Log Files Statistics
Add Ons imood audio-tracker formmail
Links W3 CSS HELP Tidy Xenu Amaya Our Fav Links Free graphics

Did we help you? Then please link back!

* Disclaimer : HomeMadeHTML.com does not intend to be the complete or total HTML resource, but rather a place where we can answer questions we frequently get when building sites, and questions we see asked in help rooms and emails. The site is a point to interact and make available help to all levels of users. You can't find your problem or solution listed? Mail it in or search the web, and good luck! All questions submitted and their solutions become the property of HomeMadeHTML.com and may be published in part or in its entirety on this site. All programs and sites listed or referenced on this site are Copyrighted by their respective owners.