New Revised CSS Library Forums Web Tools
FAQs Awards Usage Terms Contact
Other Sections
Bookmark to

FF1+ IE5+ Opr7+

Scrollable content script

Author: Dynamic Drive

Note: Last updated Oct 17th 12', by vwphillips

Description: Display overflowing content in a confined area and let users view the entire content via custom up and down scroll buttons. Support multiple instances of scrollable content on one page.


DHTML is the combination of HTML, JavaScript, and CSS

- DOM stands for Document Object Model

- DHTML allows content on a page to change on the fly, without reloading the page

- CSS allows for the separation between content definition and formatting

- CSS stands for Cascading style sheet

- Dynamic Drive provides free, cut and paste DHTML scripts

Directions: Developer's View

Step 1: Add the following code into the <BODY> section of your page:

Select All

Step 2: The script uses two images as part of its interface. You can create your own, or use the two below (enlarged for easier download):

(right click images, and select "Save Image As")

Upload them into the same directory as your webpage.

Technical Note

To alter the interface's width, change all occurrences of the number "175" and "170" to another number. To alter its height, change the occurrences of "160".

An interesting way to decorate the script is with a background image.