What would be the best way to make an element draggable when clicking anywhere in the window?

Would I have to use a container <div> that covers the whole window?

I tried making the body draggable but that didn't work.

The problem with using a container <div> is that it moves and therefore doesn't cover the whole of the screen any more after it has been dragged.

What about making a really vast container <div> that spans a large number of pixels in every direction so you would never get to the edge of it. Is that a bad idea?

The idea (simplified) is to have a page with a square in the middle that can be dragged by dragging any part of the window.

Here's a wonderfully unnecessary mockup :)