DOM Element Width before Appended to DOM

The Mootools Element.Measure functionality that Oscar mentioned is awesome. For those that use jQuery, here's a quick plugin that accomplishes the same thing:

$.fn.measure = (fn)->
  el = $(this).clone(false)
  el.css
    visibility: 'hidden'
    position:   'absolute'
  el.appendTo('body')
  result = fn.apply(el)
  el.remove()
  return result

You can call it like this, making sure to return the value (thanks Sam Fen for pointing that out!):

width = $('.my-class-name').measure( function(){ return this.width() } )

The trick is to show the element (display:block) but also hide it (visibility:hidden) and to set it’s position to absolute so that it doesn’t affect the page flow.

The MooTools Element.Measure class does this, as Oscar mentioned.