Get actual width and height of a component

Question

We\'re facing a fairly scary issue in JavaScript that none of us seems to be quite capable of resolving:

How do we get the width and height of a DOM element, including

Answer 1

You run into this often if you need to initially hide components like accordions, sliders, and other things that require bounding box information to work properly.

A simple trick is to just add css that hides the visibility of the content in question and ensures that it doesn't flicker or cause interfere with your layout.

It can be something as simple as:

{   visibility:hidden;
    position:absolute;
    left: -9999px;
}

And then setting position back to static or relative and visibility back to visible when you're ready to show the component.

The fiddle is here, but there's not much to it: http://jsfiddle.net/gwwar/ZqQtz/1/