How to Customize a Scroll Box Generator
A scroll box generator is a Web-based application that creates a div container with a scroll bar you can copy and paste into your own website, blog or social networking page. After inputting the width, height, color and a few other options, the scroll box generator creates a div container tag that includes the necessary CSS code to render the scroll box in the chosen style. You can customize your scroll box generator options by editing the text fields and menus on the scroll box generator Web page.
Other People Are Reading
Instructions
-
-
1
Launch your Web browser and navigate to a scroll box generator Web page.
-
2
Click to place your cursor in the "Width" text field and erase the default width value, if present. Type the desired width of the scroll box. Delete the value from the "Height" text field, and replace the desired height of the scroll box.
-
-
3
Click the "Background Color" text field, or click "Color Chooser" next to the "Background Color" text field, to display a color choosing panel. Click to choose a background color.
-
4
Click the "Border Color" text field, or the "Color Chooser" link next to the "Border Color" text field, then click to select a border color.
-
5
Click to select a border width and border style from the drop-down menus.
-
6
Click to select the color for the text inside of the scroll box from the "Text Color" color chooser panel. Type or select a font size in the "Font Size" field, then select a font face in the "Font Face" drop-down menu. Click to place a check in the "Bold" or "Italic" boxes to change the style of the text in the scroll box.
-
7
Type a background image URL in the "Background Image" text field, if available. The background image can be any image on the Web that you want to display as the background in the scroll box. Images that are smaller than the scroll box width and height will be repeated to fill the available area.
-
8
Type the text that you want to display in the scroll box in the "Paragraph" or "Your Text" box. If no text box is displayed, type your code before the "</div>" portion of the generated scroll box code.
-
9
Click the "Submit" or "Generate Code" button to generate the scroll box code.
-
10
Highlight the scroll box code, then press and hold "Ctrl" ("Command" key on Mac computers) and tap "C" to copy the code to your clipboard.
-
1
