Retrieves the scrolling width of the object.
Syntax
HTMLN/AScripting[ iWidth = ] object.scrollWidth
Possible Values
iWidth Pointer to a nonnegative long integer that specifies the width, in pixels.The property is read-only. The property has no default value.
The property is read-only. The property has no default value.
Remarks
The width is the distance between the left and right edges of the object's visible content.For more information about how to access the dimension and location of objects on the page through the Document Object Model (DOM), see Measuring Element Dimension and Location.
The width is the distance between the left and right edges of the object's visible content.
For more information about how to access the dimension and location of objects on the page through the Document Object Model (DOM), see Measuring Element Dimension and Location.
Example
When the overflow property is set to auto, the content can exceed the dimensions of an element, and scroll bars appear. You can use the scrollWidth property to retrieve the width of the content within the element.This example uses the scrollWidth property to compare the viewable width of the content to the actual width of a div element. The width of the element is exposed through the offsetWidth property. <script type="text/javascript"> function fnCheckScroll() { var iScrollWidth = oDiv.scrollWidth; var iOffsetWidth = oDiv.offsetWidth; var iDifference = iScrollWidth - iOffsetWidth; alert("Width: " + iOffsetWidth + "\nscrollWidth: " + iScrollWidth + "\nDifference: " + iDifference); } </script> ... <div id="oDiv" style="overflow: scroll; height= 50px; width= 400px; text-align: left" nowrap> ... </div> <button onclick="fnCheckScroll()">Check scrollWidth</button> This feature requires Microsoft Internet Explorer 4.0 or later. Click the following icon to install the latest version. Then reload this page to view the sample.
When the overflow property is set to auto, the content can exceed the dimensions of an element, and scroll bars appear. You can use the scrollWidth property to retrieve the width of the content within the element.
auto
This example uses the scrollWidth property to compare the viewable width of the content to the actual width of a div element. The width of the element is exposed through the offsetWidth property.
<script type="text/javascript"> function fnCheckScroll() { var iScrollWidth = oDiv.scrollWidth; var iOffsetWidth = oDiv.offsetWidth; var iDifference = iScrollWidth - iOffsetWidth; alert("Width: " + iOffsetWidth + "\nscrollWidth: " + iScrollWidth + "\nDifference: " + iDifference); } </script> ... <div id="oDiv" style="overflow: scroll; height= 50px; width= 400px; text-align: left" nowrap> ... </div> <button onclick="fnCheckScroll()">Check scrollWidth</button>
Standards Information
There is no public standard that applies to this property.
Applies To
A, ADDRESS, APPLET, B, BDO, BIG, BLOCKQUOTE, BODY, BUTTON, CAPTION, CENTER, CITE, CODE, COL, COLGROUP, CUSTOM, DD, DFN, DIR, DIV, DL, DT, EM, EMBED, FIELDSET, FORM, HEAD, hn, HTML, I, IMG, INPUT type=button, INPUT type=checkbox, INPUT type=file, INPUT type=image, INPUT type=password, INPUT type=radio, INPUT type=reset, INPUT type=submit, INPUT type=text, ISINDEX, KBD, LABEL, LEGEND, LI, LISTING, MENU, META, NOBR, OBJECT, OL, OPTION, P, PLAINTEXT, PRE, S, SAMP, SCRIPT, SELECT, SMALL, SPAN, STRIKE, STRONG, SUB, SUP, TABLE, TBODY, TD, TEXTAREA, TFOOT, TH, THEAD, TR, TT, U, UL, VAR, XMP, Element Constructor
See Also
width, scrollHeight, scrollLeft, scrollTop