Javascript JQuery-使用滑块调整多个不同的div宽度'；s

在过去的几周里，我一直在开发一个自定义表控件，现在集成了jqueryslider函数来增加/减少行的大小

我尝试过的：

• 我尝试使用

  $（'.divClass'）.css（{'transform'：'scale（）}）

  ，但scale会增加水平面两侧和垂直面两侧的大小，从而溢出到表后面

• 我曾想过将其宽度的值分配给一个变量，然后在滑块的

  ui.value

  上进行更改，但当我尝试时，它的工作方式与我希望的完全相反

• 在那次失败之后，我把事情搞得一团糟：

  $("#slider").slider({
      value: 50,
      min: 50,
      max: 100,
      step: 1,
      slide: function (event, ui) {
  
          $('.divBodyView').find('.divRow').css('height', ui.value)
          $('.divBodyView').find('.divRow').find('.divCell').css('height', ui.value / 1.25)
          $('.divBodyView').css('font-size', ui.value / 3)
  
          $('.divBodyView').find('.divRow').find('.divCellPicture').css('height', ui.value / 1.5)
          $('.divBodyView').find('.divRow').find('.divCellPicture').css('padding-top', ui.value / 10)
  
      }
  });
  

现在，这工作有点好。从某种意义上说。然而，我很难接受这样一个事实：我在这个表中有多个“列”，每一列都是一个自定义宽度

即：

[PICTURE:50px]-[ID:100px]-[DESCRIPTION:250px]-[ASSIGNED:125px]

现在，我如何根据它们当前持有的值来更改所有这些的值？基本上，如果我将行数增加20px，我将拥有“Picture:70px，ID:120px，Description:270px，Assigned To:145px”

---

提前感谢您的帮助。

您可以尝试使用以下方法仅扩展第一列：

 $('.divBodyView').find('.divRow').find('.divCell:first').css('width', ui.value)

否则，您可以将每列与一个比率变量相乘