Javascript循环滑块的度数与时间的关系

我正在看这个滑块

})（）

我想做的是把它变成html5视频的时间线控件。然而，我在计算这背后的数学方面遇到了一些麻烦

试试这个：

它的工作原理是为当前位置和最后一个角度保留全局变量（您应该更改此设置以构造具有自己状态的特定刻度盘）。然后，每个运动计算增量（模360，需要适当的模函数），并假设<180度的运动为向前运动，而>180度的运动（记住-1模360为359）为负运动。然后更新累积总位置：

var current = 0;
var lastAngle = 0;

           // ... inside the handler
           var delta = 0;
           var dir = 0;
           var rawDelta = mod(deg-lastAngle,360.0);
           if(rawDelta < 180) {
              dir = 1;
              delta = rawDelta;
           } else {
              dir = -1;
              delta = rawDelta-360.0;
           }
           current += delta;
           lastAngle = deg;
           $('#test').html('angle deg= '+current);  // current instead of deg

---

如果你能描述一下这应该如何成为一个时间线控制，以及你在数学方面遇到了什么样的麻烦，那将是非常有用的。到目前为止，我要说的是，以度为单位，除以360，乘以视频长度，你就有时间了。我认为需要一个“正常”的旋转刻度盘行为，在视频中顺时针旋转向前移动，逆时针旋转向后移动。OP面临的问题是超过12点钟位置会将值重置为0。通常，旋转刻度盘每次点击都会编码一个固定的前进速度，因此不依赖于剪辑的长度，因为将整个剪辑映射为一圈就可以了。需要注意的是，这种行为只在鼠标上很笨拙-使用触摸板或触摸屏，这会产生非常整洁的输入。

var current = 0;
var lastAngle = 0;

           // ... inside the handler
           var delta = 0;
           var dir = 0;
           var rawDelta = mod(deg-lastAngle,360.0);
           if(rawDelta < 180) {
              dir = 1;
              delta = rawDelta;
           } else {
              dir = -1;
              delta = rawDelta-360.0;
           }
           current += delta;
           lastAngle = deg;
           $('#test').html('angle deg= '+current);  // current instead of deg

function mod(x,n) {
   return ((x%n)+n)%n;
}