Resize Utility: Examples

The Resize Utility provides an API and skin for making DOM elements resizable.

• Simple Resize: This example shows how to make a DIV resizable.
• Proxy Resize: This example shows how to make a DIV resizable, using a proxy element.
• Animated Proxy Resize: This example shows how to make a DIV resizable, using a proxy element and animation.
• 8-way Element Resize: This example shows how to make an element resizable by all 8 handles.
• Ghosting and Custom Proxy Resize: This example shows how to use ghosting and manipulate the proxy element.
• Custom resizing for the Rich Text Editor: This example shows how to customize the Resize Utility for things like the Rich Text Editor.
• Split Pane resizing with Grids CSS: This example shows how to make a resizable split pane with Grids CSS.
• Skinning the Resize Utility: Resize skinning is done via CSS. The Resize Utility comes with a default skin, but you can extend or override this as needed.

Other YUI Examples That Make Use of the Resize Utility

• Layout inside a resizable Panel (included with examples for the Layout Manager)
• Creating a Resizable Panel (included with examples for the Container Family)
• Complex Application (included with examples for the Layout Manager)