DHTML Methods
Simulates a click on a scroll bar component.
object.doScroll ( [ sScrollAction ] )
| sScrollAction |
Optional. Determines how the object will be scrolled. This parameter can take one of the following string values:
| scrollbarDown |
Default. The down scroll arrow is at the specified location. |
| scrollbarHThumb |
The horizontal scroll thumb or box is at the specified location. |
| scrollbarLeft |
The left scroll arrow is at the specified location. |
| scrollbarPageDown |
The page-down scroll bar shaft is at the specified location. |
| scrollbarPageLeft |
The page-left scroll bar shaft is at the specified location. |
| scrollbarPageRight |
The page-right scroll bar shaft is at the specified location. |
| scrollbarPageUp |
The page-up scroll bar shaft is at the specified location. |
| scrollbarRight |
The right scroll arrow is at the specified location. |
| scrollbarUp |
The up scroll arrow is at the specified location. |
| scrollbarVThumb |
The vertical scroll thumb or box is at the specified location. |
| down |
Shortcut reference to scrollbarDown. |
| left |
Shortcut reference to scrollbarLeft. |
| pageDown |
Shortcut reference to scrollbarPageDown. |
| pageLeft |
Shortcut reference to scrollbarPageLeft. |
| pageRight |
Shortcut reference to scrollbarPageRight. |
| pageUp |
Shortcut reference to scrollbarPageUp. |
| right |
Shortcut reference to scrollbarRight. |
| up |
Shortcut reference to scrollbarUp. |
|
No return value.
CSS enables scrolling on all objects through the overflow property.
This example demonstrates the doScroll method automatically invoked at one-second intervals.
<script>
var iTimer;
function timeIt ( ) {
iTimer = setInterval ( "scrollIt ( ) ", 1000 );}
function scrollIt ( ) {
theScroller.doScroll ( "down" );}
</script>
</head>
<body onload="timeIt ( )">
<div id=theScroller>The <b>doScroll</b> method works
the same on any object that has scroll bars . . .
</div>
Show me
This example demonstrates the doScroll method on the browser page as well as on a text area.
<head>
<script language="JavaScript">
// Scrolls the page.
function scroll ( ) {
document.body.doScroll ( "scrollbarPageRight" );
}
// Scrolls the text area.
function scroll1 ( ) {
txtScrollMe.doScroll ( "scrollbarDown" );
}
// Scrolls the text area.
function scroll2 ( ) {
txtScrollMe.doScroll ( "scrollbarPageDown" );
}
</script>
</head>
<body>
<div align="center">
<button onclick="scroll ( )">
Click to Scroll Page</button>
<ul>To scroll the text area below:
<li>Single-click the button to scroll down
one line.
<li>Double-click the button to scroll down
a whole screen.
</ul>
<button onclick="scroll1 ( )" ondblclick="scroll2 ( )">
Click to Scroll Text Area</button>
<textarea id=txtScrollMe>This text area will scroll
downward when the "Click to Scroll the Text Area"
button is clicked. . . </textarea>
<textarea cols=500 rows=50>This text area causes
the browser to display scroll bars.</textarea>
</div>
</body>
Show me
BODY, DIV, SPAN, TEXTAREA
componentFromPoint, onScroll