我们可以计算jQuery UI Slider中每个步骤的DOM长度吗

Question

使用 jquery UI Slider 我只是想知道是否有一种方法可以计算 UI Slider 中步骤之间的 CSS 长度（宽度）？例如，在下面的代码中，我需要计算 step1 (min) 和 step2 之间的实际宽度，依此类推！

 $( function() {
 $('#slider').slider({
      min: 1,
      max: 5,
      range: "min",
      animate:"slow",
      value: 0
    });
  } );

Answer 1

不确定您为什么需要此详细信息。是可以计算出来的。

http://api.jqueryui.com/slider/#option-step

步骤

类型：数字

默认值： 1

确定滑块在最​​小值和最大值之间所采用的每个间隔或步长的大小或数量。滑块的完整指定值范围（最大值 - 最小值）应能被步长整除。

JavaScript

$(function() {
  $('#slider').slider({
    min: 1,
    max: 5,
    range: "min",
    animate:"slow",
    value: 0
  });
  // Collect full width
  var slideWidth = $("#slider").width();
  // Collect number of steps in slider
  var sliderSteps = $("#slider").slider("option", "step");
  var stepWidth = slideWidth / sliderSteps;
  console.log("The Slider Width: " + slideWidth + "px, with " + sliderSteps + " steps, and each steps is " + stepWidth + "px wide.");
});