带有step的jQuery移动滑翔机

Question

这是一个JSfiddle

HTML：

<form>
    <label for="slider-10">Slider:</label>
    <input type="range" name="slider-10" id="slider-10" min="0" max="999" step="1" value="0">
</form>

<form>
    <label for="slider-10">Slider:</label>
    <input type="range" name="slider-10" id="slider-10" min="0" max="99" step="1" value="0">
</form>

我对step函数有意见。对于底部滑块，它会像预期的那样前进，也就是1。当我改变最大值时，虽然在顶部滑块中，步骤函数开始表现出出乎意料的10。

对于为什么会发生这种情况，有什么想法或想法吗？

Answer 1

这种行为似乎就是JQuery移动在较小屏幕上处理宽间隔的方式。如果我增加结果窗格的宽度在您的小提琴，0-999滑块不再做不规则的步骤。在将窗格缩小到非常小的尺寸时，也会显示相同的行为(对我来说，0-99滑块在窗格变得足够小后开始执行3步)。

不过，我想指出的是，虽然滑块通过拖动控件以10的速度前进，但是在HTML中定义的步骤仍然是强制执行的。如果使用键盘上的箭头键或滑块旁边的箭头控件，则滑块按正确的数量执行步骤。如果定义的步骤在这里真的被破坏了，那么即使是那些输入方法也将步进10。