ドラッグ可能な要素のサイズ変更を停止する方法Jquery Ui？

Question

私は作業領域を持っています。そこで、私は&をドラッグして要素をサイズ変更できます。

$(objName).draggable({ 
    start: function (ev, ui) {$(this).css({opacity:0.3})}, 

    cursor:'move', 
    containment: 'parent', 
    snap:true, 
    stop: function (ev, ui) { 
     $(this).css({opacity:1}); 
     var pos = $(ui.helper).offset(); 
     console.log($(this).attr("id")); 
     console.log(pos.left) 
     console.log(pos.top) 
    } 
}) 
.resizable({ghost:true, 

}); 

ただし、サイズ変更を開始すると、作業領域の境界線でサイズを固定することはできません。あなたがする必要がどのような

Answer 1

は私が既に持っているので、

$(objName).draggable({ 
    start: function (ev, ui) {$(this).css({opacity:0.3})}, 

    cursor:'move', 
    snap:true, 
    drag: function(e, ui){ 
     var topRightCornerPos_x = $(this).css('left') + $(this).width(); 
     var bottomLeftConerPos_y = $(this).css('top') + $(this).width(); 

     if(topRightCornerPos_x > $(this).parent().width()){ 
      var maxLeft = $(this).parent().width() - $(this).width(); 
      $(this).css('left', maxLeft); 
     } 
     if(bottomLeftConerPos_y > $(this).parent().height()){ 
      var maxTop = $(this).parent().height() - $9this).height(); 
      $(this).css('top', maxTop); 
     } 
    }, 
    stop: function (ev, ui) { 
     $(this).css({opacity:1}); 
     var pos = $(ui.helper).offset(); 
     console.log($(this).attr("id")); 
     console.log(pos.left) 
     console.log(pos.top) 
    } 
}) 
.resizable({ghost:true, 
    containment: $('#workingarea_id') 
}); 

か、再度あなたがサイズ変更可能なのparams