HTML DOM Element scrollLeft

Get the number of pixels the content of "myDIV" is scrolled:

const element = document.getElementById("myDIV");
let x = elmnt.scrollLeft;
let y = elmnt.scrollTop;

Scroll the contents of "myDIV" TO 50 pixels horizontally and 10 pixels vertically:

const element = document.getElementById("myDIV");
element.scrollLeft = 50;
element.scrollTop = 10;

Scroll the contents of "myDIV" BY 50 pixels horizontally and 10 pixels vertically:

const element = document.getElementById("myDIV");
element.scrollLeft += 50;
element.scrollTop += 10;

More examples below.

Description

The scrollLeft property sets or returns the number of pixels an element's content is scrolled horizontally.

Return the scrollLeft property:

element.scrollLeft

Set the scrollLeft property:

element.scrollLeft = pixels

Value	Description
pixels	The number of pixels the element's content is scrolled horizontally. If the number is negative, the number is set to 0. If the element cannot be scrolled, the number is set to 0. If the number is greater than maximum allowed, the number is set to the maximum.

Type	Description
Number	The number of pixels the element's content is scrolled horizontally.

Scroll the contents of <body> by 30 pixels horizontally and 10 pixels vertically:

const html = document.documentElement;
html.scrollLeft += 30;
html.scrollTop += 10;

element.scrollLeft is supported in all browsers:


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