Example

--- title: Element.scrollWidth slug: Web/API/Element/scrollWidth tags: - API - CSSOM View - NeedsMarkupWork - NeedsSpecTable - プロパティ - リファレンス browser-compat: api.Element.scrollWidth translation_of: Web/API/Element/scrollWidth --- {{APIRef("DOM")}} **`Element.scrollWidth`** は読み取り専用のプロパティで、あふれたために画面に表示されない部分を含めた、要素の中身の幅の寸法です。 `scrollWidth` の値は、水平スクロールバーを使用せずにすべてのコンテンツをビューポート内に合わせるために要素が必要とする最小幅に等しくなります。幅は {{domxref("Element.clientWidth", "clientWidth")}} と同じ方法で定めます。要素のパディングは含みますが、境界線、マージン、 (もしあれば) 垂直スクロールバーは含みません。これには {{cssxref("::before")}} または {{cssxref("::after")}} のような疑似要素の幅を含むことがあります。要素の内容が水平スクロールバーが必要なく合うのであれば、 `scrollWidth` は {{domxref("Element.clientWidth", "clientWidth")}} と等しくなります。 > **Note:** このプロパティは値を整数値に丸めます。小数値が必要であれば、 {{ domxref("element.getBoundingClientRect()") }} を使用してください。 ## 構文 ```js var xScrollWidth = element.scrollWidth; ``` `xScrollWidth` はピクセル単位の `element` のコンテンツの幅です。 ## 例 ```html Example

FooBar-FooBar-FooBar-FooBar

``` ### 結果 {{EmbedLiveSample('Example')}} ## 仕様書 {{Specifications}} ## ブラウザーの互換性 {{Compat}} ## 関連情報 - {{domxref("Element.clientWidth")}} - {{domxref("HTMLElement.offsetWidth")}} - [要素の寸法の決定](/ja/docs/Web/API/CSS_Object_Model/Determining_the_dimensions_of_elements)