document.body is null

Question

I've got a page where I'm using Mootools 1.2.4 and MediaboxAdvanced as a lightbox. I can't seem to get the thing working because of a particular javascript error

document.body is null

at the initialization of Mediabox:

$(document.body).adopt(
     $$([
          overlay = new Element("div", {id: "mbOverlay"}).addEvent("click", close),
          center = new Element("div", {id: "mbCenter"})
     ]).setStyle("display", "none")
); 

The page is here. If yo uclick on the guy's name, picture, or the More Info button on the bottom right, it is supposed to launch the Mediabox. Via Firebug, I have confirmed that the CSS is loading, mootools is loading, and the Mediabox script is loading; all the paths to images and everything are correct as well.

Any ideas?

Answer 1

You may only be able to use $ on an element returned from getElementById. A simple workaround is to instead use $$.

$$('body')[0].adopt...