Search code examples
jquery-uijquery-ui-resizable

jQuery UI Resizable Drag Right Edge Past Left Edge

I'm using jQuery UI's Resizable plugin to resize divs horizontally. For the most part, everything is working, but there are a few cases where I would want to drag the left side past the right side or vice versa.

I've noticed that when I try this, I stop receiving the resize events once the right edge has moved left of the left edge.

Is there a setting that would allow me to go pasted that boundary? Or do I just have to resize the element on start, moving the left edge further left, to be big enough to allow this?

Solution

  • Found it. This can be accomplished by setting the minWidth option to a negative number in the start handler.

    $(selector).resizable({
  ...
  start: function(e, ui) {
    ui.element.resizable('option', 'minWidth', -500);
  },
  ...
});