$('.box').resizable({
disabled: true
});
and here's the CSS
.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
display: none;
}
According to the docs, when disabled is true, the .ui-resizable-disabled class gets added to the element. In my case the classes does not get added but the resizing is still disabled (meaning I can't resize by dragging the handles, but when disabled is false I can resize). When I check the generated HTML, style="display:block" was added to the handles. I'm not doing any show hide on them.
<div class="ui-resizable-handle ui-resizable-e" style="display: block; ">...</div>
I'm using jQuery 1.8 from Google API. I'm also applying draggable to the same elements.
Looks like its a default behavior. You can not resize though there is a handler. Anyways, you could hide the handler as:
//Dirty hack
$('div.ui-resizable-handle').hide();
//Somewhat effective solution
$( "#resizable" ).resizable({ disabled: true, handles: 'e' });