Javascript 使用jQuery Resizeble更改填充

我正在尝试使用jqueryresizeable来编辑元素上的填充，并且一直在努力让这个坏家伙工作，或者寻找可能提供一些见解的资源

我这样做主要是为了将高度变化映射到填充变化：

$(".block-wrapper").resizable({
      handles: "n, s",
      resize: function(event, ui) {

          var padding = ((ui.size.height - ui.originalSize.height)/2);

          ui.element.css({
              'height': 'initial',
              'padding-top': padding+'px',
              'padding-bottom': padding+'px'
          });

       }

});

（更多信息请点击此处：）

它在第一次工作时非常完美，但当您再次返回调整它时，它会在再次调整大小之前恢复到原始大小

---

关于如何解决这个问题的任何想法都将非常棒。

您的问题在于行

var padding=（（ui.size.height-ui.originalSize.height）/2）

当您停止调整块的大小时，即在
mouseup
上，
ui.originalSize.height
被设置为最后一个
ui.size.height
，因此
ui.size.height-ui.originalSize.height
返回到零，并且您的填充消失了

但是你为什么要经历使用填充物的所有麻烦呢？
如果只是将文本垂直居中，有一些更简单的css解决方案

.block-wrapper {
    display: flex;
    justify-content: center; /* align horizontal */
    align-items: center; /* align vertical */
 }

更简单的是：

jQuery(document).ready(function($){
   $(".block-wrapper").resizable({handles: "n, s"});
});

您的问题在于行
var padding=（（ui.size.height-ui.originalSize.height）/2）

当您停止调整块的大小时，即在
mouseup
上，
ui.originalSize.height
被设置为最后一个
ui.size.height
，因此
ui.size.height-ui.originalSize.height
返回到零，并且您的填充消失了

但是你为什么要经历使用填充物的所有麻烦呢？
如果只是将文本垂直居中，有一些更简单的css解决方案

.block-wrapper {
    display: flex;
    justify-content: center; /* align horizontal */
    align-items: center; /* align vertical */
 }

更简单的是：

jQuery(document).ready(function($){
   $(".block-wrapper").resizable({handles: "n, s"});
});

谢谢加布里埃尔。填充物应用得很好，包括鼠标。当您再次调整块的大小时，它会清除填充，就像块从其原始大小开始一样。我的猜测是Resizeable正在读取当前高度（显然不包括填充），导致它在后续调整大小时迅速恢复到原来的大小。@JeremyAbraham:是的，我同意，填充应用得很好。我的意思是，使用
ui.size.height
和
ui.originalSize.height
计算的填充值在开始调整大小时始终为零，因为
originalSize
不是任何调整大小之前块的第一个大小，而是单击拖动鼠标后移动鼠标之前的大小。那我的第二个选择呢？你真的需要调整填充物吗？谢谢Gabriel。填充物应用得很好，包括鼠标。当您再次调整块的大小时，它会清除填充，就像块从其原始大小开始一样。我的猜测是Resizeable正在读取当前高度（显然不包括填充），导致它在后续调整大小时迅速恢复到原来的大小。@JeremyAbraham:是的，我同意，填充应用得很好。我的意思是，使用
ui.size.height
和
ui.originalSize.height
计算的填充值在开始调整大小时始终为零，因为
originalSize
不是任何调整大小之前块的第一个大小，而是单击拖动鼠标后移动鼠标之前的大小。那我的第二个选择呢？你真的需要调整衬垫吗？