Mar 4th
2010

jQuery UI Resizable Custom Handle Syntax

I’ve had to work with jQuery UI’s Resizable plugin on a recent project.  I wanted to use custom handles to drag the element for resize, but the documentation page is a bit sparse when it comes to specifying a DOM Element to use for your custom handle.  For the sanity of others, here is the correct syntax to use when trying to add a custom handle to the jQuery UI Resize plugin.

$("#resize_me").resizable({handles: {'n': '#handle'}});

Note, your handle needs to be inside your resizable element in your HTML and you need to add to the proper class to the handle:

<div id="handle"  class="ui-resizable-handle ui-resizable-n">

Hope this helps some folks.

Next Post → ← Previous Post