EXAMPLE: Resizable Window VIEW SOURCE

In this example, an instance of the Uize.Widget.Window.Resizable class is being used to implement a resizable window for a modal dialog. The window can be resized by dragging on any of the corners or sides. Dragging on a side changes the window's dimensions in one axis only, while dragging on a corner changes the dimensions in both axes. In any given HTML implementation of a resizable window, all drag handles are optional. If you like, you can provide just a lower right corner drag handle. Since resizable windows share code with the marquee widget (Uize.Widget.Resizer.Marquee), it is possible to configure a resizable window to have a constrained aspect ratio, or to be resizable only in one axis, by setting state for its resizer child widget. By inheriting from the Uize.Widget.Window base class, the resizable window widget gets child widgets for the "OK", "CANCEL", and "CLOSE" buttons.

To open the window, click the "OPEN WINDOW" button below.

OPEN WINDOW