Window scrollBy() Method
Example
Scroll the document by 100px horizontally:
window.scrollBy(100, 0); // Scroll 100px to the right
Try it Yourself »
More "Try it Yourself" examples below.
Definition and Usage
The scrollBy() method scrolls the document by the specified number of pixels.
Note: For this method to work, the visible property of the window's scrollbar must be set to true!
Browser Support
| Method | |||||
|---|---|---|---|---|---|
| scrollBy() | Yes | Yes | Yes | Yes | Yes |
Syntax
window.scrollBy(xnum, ynum)
Parameter Values
| Parameter | Type | Description |
|---|---|---|
| xnum | Number | Required. How many pixels to scroll by, along the x-axis (horizontal). Positive values will scroll to the right, while negative values will scroll to the left |
| ynum | Number | Required. How many pixels to scroll by, along the y-axis (vertical). Positive values will scroll down, while negative values scroll up |
Technical Details
| Return Value: | No return value |
|---|
More Examples
Example
Scroll the document by 100px vertically:
window.scrollBy(0, 100); // Scroll 100px downwards
Try it Yourself »
Example
Scroll the document horizontally and vertically:
<button onclick="scrollWin(0, 50)">Scroll down</button>
<button onclick="scrollWin(0, -50)">Scroll up</button>
<button onclick="scrollWin(100, 0)">Scroll right</button>
<button onclick="scrollWin(-100, 0)">Scroll left</button>
<script>
function scrollWin(x, y) {
window.scrollBy(x, y);
}
</script>
Try it Yourself »
Related Pages
Window Object: scrollTo() Method
❮ Window Object
