Propriedade HTML DOM scrollLeft
Exemplo
Obtenha o número de pixels que o conteúdo de um elemento <div> é rolado horizontalmente e verticalmente:
var elmnt = document.getElementById("myDIV");
var x = elmnt.scrollLeft;
var y = elmnt.scrollTop;
Mais exemplos de "Experimente você mesmo" abaixo.
Definição e uso
A propriedade scrollLeft define ou retorna o número de pixels em que o conteúdo de um elemento é rolado horizontalmente.
Dica: Use a propriedade scrollTop para definir ou retornar o número de pixels em que o conteúdo de um elemento é rolado verticalmente.
Dica: Para adicionar barras de rolagem a um elemento, use a propriedade CSS overflow .
Suporte ao navegador
Property | |||||
---|---|---|---|---|---|
scrollLeft | Yes | Yes | Yes | Yes | Yes |
Sintaxe
Retorne a propriedade scrollLeft:
element.scrollLeft
Defina a propriedade scrollLeft:
element.scrollLeft = pixels
Valores de propriedade
Value | Description |
---|---|
pixels |
Specifies the number of pixels the element's content is scrolled horizontally. Special notes:
|
Detalhes técnicos
Valor de retorno: | Um número, representando o número de pixels em que o conteúdo do elemento foi rolado horizontalmente |
---|
Mais exemplos
Exemplo
Role o conteúdo de um elemento <div> PARA 50 pixels horizontalmente e 10 pixels verticalmente:
var elmnt = document.getElementById("myDIV");
elmnt.scrollLeft = 50;
elmnt.scrollTop = 10;
Exemplo
Role o conteúdo de um elemento <div> 50 pixels horizontalmente e 10 pixels verticalmente:
var elmnt = document.getElementById("myDIV");
elmnt.scrollLeft += 50;
elmnt.scrollTop += 10;
Exemplo
Role o conteúdo de <body> em 30 pixels na horizontal e 10 pixels na vertical:
var body = document.body; // Safari
var html = document.documentElement; //
Chrome, Firefox, IE and Opera places the overflow at the <html> level, unless else is specified. Therefore, we use the
documentElement property for these browsers
body.scrollLeft += 30;
body.scrollTop += 10;
html.scrollLeft += 30;
html.scrollTop += 10;