做一些数学运算以使用Javascript计算范围

Question

我正在尝试使用Javascript创建范围显示。它不是一个范围滑块，而是将显示一个div内2个值的范围。

我将尝试举例说明

• 外部“样式范围” div保留绝对的最小值和最大值，并且正好为183px宽。这是范围显示的边界。
• 内部“范围” div也有最小值和最大值，需要在屏幕截图中突出显示。因此，在此示例中，它将是一个非常小的宽度高亮区域，靠近范围显示的左边缘。

• 内部跨度必须是该范围内较暗的指针。

  <div class="col-sm style-range abv" data-step="0" data-max="15" data-min="2" data-name="abv">
      <div class="range" data-min="2.2" data-max="3.3">
          <span data-value="2.7"></span>
  </div>
  

这实际上是我使用javascript所获得的...

// calc the range of an attribute
recipe.calcRange = function() {

    var $item   = $( '.ranges [data-name="abv"]' );

    var width   = $item.width();
    var diff    = $item.data( 'max' ) - $( item ).data( 'min' );

}

我需要有关Javascript部分的帮助来进行数学计算。我基本上需要将2.2和3.3的值转换为它们在范围滑块中的相关％位置。

因此2.2可能会变成5％，这意味着它从左边界开始5％，而3.3可能是16％，意味着它从左边界开始到16％结束。