Esta tradução está incompleta. Ajude atraduzir este artigo.
A propriedade Element.scrollLeft obtem, ou define o número de pixels do contéudo de um elemento que é rolado para a esquerda.
Note que se os direction
do elemento do elemento é rt1 (direita-para-esquerda) então scrollLeft
é 0
quando a barra de rolagem está na posição mais à direita (o início do conteúdo rolado) e então, fica cada vez mais negativa à medida que se desloca em direção ao fim do conteúdo.
Sintaxe
// Obtem o número de pixels rolado var sLeft = element.scrollLeft;
sLeft é um inteiro representando o número de pixels do elemento que foi movido para a esquerda.
// Define o número de pixels rolado element.scrollLeft = 10;
scrollLeft
pode ser definido para qualquer valor inteiro, entretanto:
- Se o elemento não pode ser rolado (ex.: ele é no overflow),
scrollLeft
é definido para 0. - Se definido um valor menor que 0 (maior que 0 para elementos direita-para-esquerda),
scrollLeft
é definido para 0. - Se o definido um valor maior que o máximo, que o conteúdo pode ser rolado, é
scrollLeft
é definido para o valor máximo.
Exemplo
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> #container { border: 1px solid #ccc; height: 100px; overflow: scroll; width: 100px; } #content { background-color: #ccc; width: 250px; } </style> <script> document.addEventListener('DOMContentLoaded', function () { var button = document.getElementById('slide'); button.onclick = function () { document.getElementById('container').scrollLeft += 20; }; }, false); </script> </head> <body> <div id="container"> <div id="content">Lorem ipsum dolor sit amet.</div> </div> <button id="slide" type="button">Slide</button> </body> </html>
Especificações
Especificações | Status | Comentário |
---|---|---|
CSS Object Model (CSSOM) View Module The definition of 'scrollLeft' in that specification. |
Working Draft |
Referências
Etiquetas do documento e colaboradores
Colaboradores desta página:
eustabio_junior
Última atualização por:
eustabio_junior,