Javscript prevent drag and drop outside browser window

Question

I've got a dialog screen which is placed on top of my web page. This dialog can be dragged around the page, but also outside the visible part of the page. How can I detect the 'limits' of the browser window and prevent dragging the dialog outside the page?

The following part of an case statement is exectuted when I drop the dialog window somewhere on the page. I'm also using jquery.event.drag from threedubmedia

// mouseup, stop dragging
        case 'mouseup': 
            $event.remove( document, "mousemove mouseup", handler ); // remove page events
            console.log(data);
            if ( drag.dragging ){
                if ( $special.drop ) $special.drop.handler( event ); // "drop"
                hijack( event, "dragend", elem ); // trigger "dragend"  
                }
            selectable( elem, true ); // enable text selection
            drag.dragging = drag.proxy = data.elem = false; // deactivate element
            break;
        } 

Answer 1

There is a demo on the page you linked with the desired effect: http://threedubmedia.com/code/event/drag/demo/contain