I want have width and height of a full div with scroll using JQuery, but i can only have size of visible content and not size of visible + hidden content of scroll bar.

Anyone knows anyway to have this values (width and height)?

<div id="area" class="divLeftCem area">
    <div id="panelArea" class="areaBackground"
        style="width: 1004px; height: 613px; background: #FFFFFF url('Images/background.png') repeat;">
    </div>
</div>

.area
{
    margin-left: 10px;
    width: 1004px;
    height: 613px;
    border: 1px solid #AFAFAF;
    overflow: auto;
    position: absolute;
    top: 145px;
}

PS: Sorry about bad english.

I want have width and height of a full div with scroll using JQuery, but i can only have size of visible content and not size of visible + hidden content of scroll bar.

Anyone knows anyway to have this values (width and height)?

<div id="area" class="divLeftCem area">
    <div id="panelArea" class="areaBackground"
        style="width: 1004px; height: 613px; background: #FFFFFF url('Images/background.png') repeat;">
    </div>
</div>

.area
{
    margin-left: 10px;
    width: 1004px;
    height: 613px;
    border: 1px solid #AFAFAF;
    overflow: auto;
    position: absolute;
    top: 145px;
}

PS: Sorry about bad english.

• javascript
• jquery
• html
• css

• I think jQuery gives you the actual size of the div. Could you put some code examples? – davids Commented May 21, 2012 at 15:00
• Exact, only give me the visible size of the div. – Quaquil Commented May 21, 2012 at 15:09
• I mean, it should give you the size of the complete div. Please, edit your question and add some code examples – davids Commented May 21, 2012 at 15:14

1 Answer 1

Get the element's .scrollHeight:

$(".el").get(0).scrollHeight;

​ It goes without saying you could use .scrollWidth for the x-axis as well.

Fiddle: http://jsfiddle.net/spN6n/