Question

The document says: the basic dialog window is an overlay positioned within the viewport.

Is there anyway to make it draggable partly outside the viewport? like the window in Windows system, you could drag it to 99% outside the screen.

Answer 1

I found the answer here: jQuery UI Dialog / Drag Question

if (!$.ui.dialog.prototype._makeDraggableBase) {
    $.ui.dialog.prototype._makeDraggableBase = $.ui.dialog.prototype._makeDraggable;
    $.ui.dialog.prototype._makeDraggable = function() {
        this._makeDraggableBase();
        this.uiDialog.draggable("option", "containment", false);
    };
}

This does the magic, thanks.

Btw: you may want to add “overflow: hidden;” somewhere, e.g. body {overflow: hidden;}