HTML DOMscrollLeftプロパティ
例
<div>要素のコンテンツが水平方向および垂直方向にスクロールされるピクセル数を取得します。
var elmnt = document.getElementById("myDIV");
var x = elmnt.scrollLeft;
var y = elmnt.scrollTop;
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
scrollLeftプロパティは、要素のコンテンツが水平方向にスクロールされるピクセル数を設定または返します。
ヒント:scrollTopプロパティを使用して、要素のコンテンツが垂直方向にスクロールされるピクセル数を設定または返します。
ヒント:要素にスクロールバーを追加するには、CSS オーバーフロープロパティを使用します。
ブラウザのサポート
Property | |||||
---|---|---|---|---|---|
scrollLeft | Yes | Yes | Yes | Yes | Yes |
構文
scrollLeftプロパティを返します。
element.scrollLeft
scrollLeftプロパティを設定します。
element.scrollLeft = pixels
プロパティ値
Value | Description |
---|---|
pixels |
Specifies the number of pixels the element's content is scrolled horizontally. Special notes:
|
技術的な詳細
戻り値: | 要素のコンテンツが水平方向にスクロールされたピクセル数を表す数値 |
---|
その他の例
例
<div>要素の内容を水平方向に50ピクセル、垂直方向に10ピクセルまでスクロールします。
var elmnt = document.getElementById("myDIV");
elmnt.scrollLeft = 50;
elmnt.scrollTop = 10;
例
<div>要素の内容を水平方向に50ピクセル、垂直方向に10ピクセルずつスクロールします。
var elmnt = document.getElementById("myDIV");
elmnt.scrollLeft += 50;
elmnt.scrollTop += 10;
例
<body>の内容を水平方向に30ピクセル、垂直方向に10ピクセルスクロールします。
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;