通过单击并拖动更新HTML输入字段的值（类似于unity3d界面）

Question

Unity有一个超酷的范围滑块，我在复制网络功能时遇到了麻烦。

使用单位，您可以单击字母X并向左拖动，输入字段将显示递减的数字。

如果单击字母X并向右拖动，输入字段将显示增加的数字。

但是X没有滑块，无论输入字段中的值如何，它总是在同一个地方。

Answer 1

这样做的一种方法是设置一个函数，在包含“X”的元素上按下鼠标以获得起始位置。然后将函数绑定到mousemove，它计算当前位置和X轴上的起始位置之间的差异，以确定要放在输入字段中的值。

概念证明： https://gist.github.com/anonymous/95191c56796fb2e4e5cd

代码中包含注释，用于解释发生的过程。

更多信息：

http://www.w3schools.com/jsref/event_onmousemove.asp

http://www.w3schools.com/jsref/event_onmousedown.asp

http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_event_mouse_clientxy