jQuery UI

ボタンのクリックで有効/無効を切り替える

$('button#toggle-resize').toggle(
   function() {
    $('div#ex1').resizable('disable');
    $(this).text('有効にする');
   },
   function() {
    $('div#ex1').resizable('enable');
    $(this).text('無効にする');
   }
);
$('div#ex1').resizable();

CSS設定

div#ex1{
width:250px; height:100px;
margin:3px; padding:3px;
overflow:hidden;
border:1px dashed #000;
background-color:#F1F1F1;
}

<p>拡大／縮小を<button id="toggle-resize">無効にする</button></p>
<div id="ex1" class="ui-wrapper">マウスのドラッグで拡大/縮小</div>