How do I get the real .height() of a overflow: hidden or overflow: scroll div?

I have a question regarding how to get a div height. I'm aware of .height() and innerHeight(), but none of them does the job for me in this case. The thing is that in this case I have a div that is overflown width a overflow: scroll and the div has a fixed height.

If I use .height() or innerHeight(), both of them gives me the height of the visible area, but if I want the overflown taken in to account, how do I go about?


Use the .scrollHeight property of the DOM node: $('#your_div')[0].scrollHeight


For more information about .scrollHeight property refer to the docs:

The Element.scrollHeight read-only attribute is a measurement of the height of an element's content, including content not visible on the screen due to overflow. The scrollHeight value is equal to the minimum clientHeight the element would require in order to fit all the content in the viewpoint without using a vertical scrollbar. It includes the element padding but not its margin.


Other possibility would be place the html in a non overflow:hidden element placed 'out' of screen, like a position absolute top and left lesse then 5000px, then read this elements height. Its ugly, but work well.