Javascript jqueryui：增加resizeable（）上的填充

我想知道是否可以在调整大小时增加和减少填充，而不是增加和减少高度

$( function() {
    $( "#resizable" ).resizable({
        handles: 'n,s'
    });
 });

更新：

我实际上想知道，如果我调整div的大小，我想动态地增加resize上的填充，而不是height

---

尝试从南北位置调整div的大小

是的，可能包括填充。查找更新的小提琴链接

div#resizable {
  height: 200px;
  width : 400px;
  background-color : aqua;
  padding: 0.5em;
}

---

添加了一些经过计算的更改

$( function() {
  $( "#resizable" ).resizable({
    resize: function( event, ui ) {
      var originalHeight = ui.originalSize.height;
      var newHeight = ui.size.height;
      var pad = 5;
      if (originalHeight < newHeight) {
        pad = newHeight - originalHeight;
      }
      $(this).css('padding', pad);
    }
  });
});

$（函数（）{
$（“#可调整大小”）。可调整大小({
调整大小：函数（事件、ui）{
var originalHeight=ui.originalSize.height；
var newHeight=ui.size.height；
var-pad=5；
if（原始高度<新高度）{
pad=新高度-原始高度；
}
$（this.css（'padding'，pad）；
}
});
});

---

对不起，我想你不明白我的意思。我想知道，如果我调整div的大小，我想在resize上动态增加padding，而不是heights。一件事是，我如何停止增加高度，因为我希望padding是增加的，而不是高度。当我再次尝试调整元素大小时，调整元素大小后出现问题。它变小了，你只需要根据你的要求做一些调整，我只是编码了如何增加填充和高度和宽度。