Question

我想在滚动条/滑块中实现类似于微动拨号的行为，如下所示：

在开始时，手柄位于“滚动条/滑块”区域的中间。当您单击手柄并向左或向右拖动（同时保持单击）时，将执行一些其他操作（更新页面上的其他区域） - 滑块拖动到左端或右端越多，快点。释放鼠标按钮后，手柄应快速回到滑块区域的中间位置。

有什么基本上像jquery / ui插件/组件/脚本这样的可以利用和扩展的行为吗？

更新以澄清：

我已经有一个像http://jqueryui.com/demos/slider/

这样的滑块

我希望此滑块的行为方式如下：

滑块的手柄应从
滑块当您单击手柄时可以向左或向右拖动它（只要按住鼠标按钮）
释放鼠标按钮时，滑块的手柄应快速回到起始位置（中间/中间）
取决于句柄当前的距离和侧面，我想滚动其他内容（其他内容不是此问题的一部分）

希望这有助于更好地解释我的意图和问题。

Answer 1

如果您在停止事件处理程序中将滑块值更改回零，那么您将获得所需的快照，这是我刚刚制作的缩放速度控制的代码：

$('#zoomslider').slider({
    slide: function(event,ui){
            setzoomspeed(ui.value)
        },

    stop: function(event,ui) {
        $('#zoomslider').slider("value",0);
        setzoomspeed(0);
    },  
    min:-20,
    max:20,
    value:0
});

Answer 2

您应该尝试jQuery UI Slider

在“事件”标签中，您可以看到可以设置change处理程序。

然后，您可以在处理程序中获取滑块的当前值，例如

$( ".selector" ).slider({
   change: function(event, ui) {
       var current_value = ui.value;
       //do something
   }
});

javascript draggable滑块，可以在mouseUp上快速回到中间位置

2 个答案: