O'Reilly logo

jQuery UI Cookbook by Adam Boduch

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Applying effects to dialog resize interactions

By default, the dialog widget allows users to resize by dragging the resize handle. The actual resize capability is provided by the resizable() interaction widget setup internally by the dialog when the resizable option is true. Let's take a look at how to gain access to the internal resizable component, so that we can use the animate feature. This option, when set on a resizable component, delays the redrawing of the resized component until the user has stopped dragging the resize handle.

Getting ready...

We only need simple dialog HTML for this demonstration, like this:

<div id="dialog" title="Dialog Title">
    <p>Basic dialog content</p>
</div>

How to do it...

Let's add a new option to the dialog widget ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required