View Full Version : edit scrolling text

06-09-2007, 06:28 AM
Thanks to ND & Karen.
I am using the following script to have a scrolling table and/or text block.

Configuring the script: The width of the "window" is represented by the value 170, and the height, 150. To alter the dimensions, change ALL instances of 170 to another value, and the same for 150 (just do a search-and-replace). You can also give the window a different background color. Just change "yellow" to another color name.

Simply copy the below into the <body> section of your web page:

<ilayer name="scroll1" width=170 height=150 clip="0,0,170,150">
<layer name="scroll2" width=170 height=150 bgColor="lightyellow">
<div id="scroll3" style="width:170px;height:150px;background-color:lightyellow;overflow:scroll">
<big>T</big>his is a cool script that allows you to compact any content and confine it within a scrollable mini "window" Save valuable document space while making your page more "interactive", all at the same time! This script uses two different techniques- one for IE, one for NS- to create the scrollable window. Scrollbars will be available to IE 4 users to scroll the window, while NS users will need to use the "up" and "down" buttons instead (since NS does not support the adding of scrollbars to contents).


* Scrollable content Script- Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code

var nsstyle='display:""'
if (document.layers)
var scrolldoc=document.scroll1.document.scroll2
function up(){
if (!document.layers) return
if (scrolldoc.top<0)
function down(){
if (!document.layers) return
if (scrolldoc.top-150>=scrolldoc.document.height*-1)

function clearup(){
if (window.temp2)

function cleardown(){
if (window.temp)

<br><span style="display:none" style=&{nsstyle};><a href="#" onMousedown="up()"
onMouseup="clearup()" onClick="return false" onMouseout="clearup()">Up</a> | <a href="#"
onMousedown="down()" onMouseup="cleardown()" onClick="return false"
onMouseout="cleardown()">Down</a> | <a href="#" onClick="if (document.layers) scrolldoc.top=0;return false">Top</a> | <a href="#" onClick="if (document.layers) scrolldoc.top=scrolldoc.document.height*(-1)+150;return false">Bottom</a></span>

I will never want the horizontal bar to appear. What section(s) do I remove to eliminate the horizontal scroll bar?