码农教程 - 一技在手,衣食无忧! tools

目录

Window scrollBy()

❮ Previous ❮ Window Object Reference Next ❯

Example

Scroll the document 100px horizontally:

window.scrollBy(100, 0);
Try it Yourself »

Scroll the document 100px vertically:

window.scrollBy(0, 100);
Try it Yourself »

More examples below.

Description

The scrollBy() method scrolls the document by the specified number of pixels.

Note

For the scrollBy() method to work, the document must be larger than the screen, and the scrollbar must be visible.

See Also:

The scrollTo() method.

Syntax

window.scrollBy( x, y)
scrollBy( x, y)

Parameters

Parameter Description
x Required.
Number of pixels to scroll (horizontally).
Positive values scroll to the right, negative values to the left.
y Required.
Number ofpixels to scroll (vertically).
Positive values scroll down, negative values scroll up.

Return Value

NONE

More Examples

Scroll the document up and down:

<button onclick="scrollWin(0, 50)">Scroll down</button>
<button onclick="scrollWin(0, -50)">Scroll up</button>

<script>
function scrollWin(x, y) {
  window.scrollBy(x, y);
}
</script>
Try it Yourself »

Scroll the document right and left:

<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 »

Browser Support

scrollBy() is supported in all browsers:

Chrome Edge Firefox Safari Opera IE
Yes Yes Yes Yes Yes Yes


❮ Previous ❮ Window Object Reference Next ❯