Javascript 如何通过拖动图像来调整div的大小？

我这里有一个小问题，也许我能找到过去处理过这个问题的人

如何在拖动图像时调整div的大小

我使用的是可调整大小和拖动的jqueryui

以下是一个实时URL：

我试图弄清楚是否可以通过拖动笔刷来调整div的大小。所需的行为类似于进度条，只是它需要手动完成，而不是自动完成

---

谢谢

使用events dragg来调整容器div的大小，就像，它只会增加它

            $(function() {
            $(".basecoat").resizable({maxWidth:598, ghost:true});
            $(".basecoat img.brush").draggable({
  start: function() {

    getCurrentPositionContainer= getOffset($(".basecoat"));

    limitX=getCurrentPositionContainer.left;

    limitY=getCurrentPositionContainer.top;

  },
  drag: function() {

    getCurrentPositionDraggable = getOffset($(".basecoat img.brush"));

    toLimitX=getCurrentPositionDraggable.left;

    toLimitY=getCurrentPositonDraggable.top;


    if(toLimitX>=limitX){

      currentWidth= $(".basecoat").width;

      $(".basecoat").width=currentWidth+10;

    }

    if(toLimitY>=limitY){
       currentHeight= $(".basecoat").height;

      $(".basecoat").height=currentHeight+10;
    }

    //set function to less 

  },
  stop: function() {
     //set any function like stop,
  }
}
);


function getOffset( el ) {
var _x = 0;
var _y = 0;
while( el && !isNaN( el.offsetLeft ) && !isNaN( el.offsetTop ) ) {
    _x += el.offsetLeft - el.scrollLeft;
    _y += el.offsetTop - el.scrollTop;
    el = el.offsetParent;
}
return { top: _y, left: _x };
}

---

与此同时，我发现了一个CSS问题，它为我解决了这个问题。我用这一行扩展了可调整大小触发器的区域：

.ui-resizable-e {width:67px;}

---

这是小提琴：

非常感谢。不幸的是，您提供的代码实际上并不能解决问题。