Website Design Articles :: Useful Tools

Customise scrollbar generator

Note: Much as it grieves me to say this, this does not work in Mozilla Firefox - nor does the output...IE users read on...

Using a scrolling text box and want to customise your scrollbars to match your site?

Then there is a handy online colour scrollbar generator here. which will build your Scrollbar Colour code for you and let you see the results.

Just use the drop downs to fill in the colours, copy the code and then paste in between the HEAD tags or in your stylesheet.

Here's some code for the scrolling textbox too:

Position your cursor where you want the scrolling box to be, add the following:

<div id="main" style="position:relative; top:20px; height:350px; overflow: auto; visibility: visible;">

Adjust the height and top parameters to suit, write your text and then add a closing DIV tag - </div>.

If you prefer to put the style info in your stylesheet then just put

<div id="main">

before your text and add this to the stylesheet:

#main {
position:relative;
top:20px;
height:350px;
overflow: auto;
visibility: visible;
}

Easy peasy!