沿着弧线拖拽滑动动画

        因为在项目中遇到一个问题，即需要在移动端页面上滑动滑块，实现在弧形的线条上调节数值的大小。一时找不到合适的的办法，终于发现一个jQuery的插件可以完美的解决这个问题，真是帮了我的大忙。

roundslider是一个jQuery插件，允许用户通过拖动滑块手柄来选择值或值的范围。

这是他的官网截图：

弧形的控件样式很多，也可以根据自己的实际需求更改样式。当然他也支持事件的处理。

这是我写的一段代码：

 $("#out_circle").roundSlider({
            sliderType: "min-range",
            width: "4",
            radius: "115",
            showTooltip: true,
            editableTooltip: false,
            keyboardAction: false,
            max: "255",//滑块的最大值
            min: "0",//滑块的最小值,
            handleSize: "+30",
            startAngle: 315,
            circleShape: "pie",
            tooltipFormat: "tooltipVal1",
            disabled: false,
---------------------------下面是他的事件处理--------------------------------------
            drag: function (e) {
                $fanSet.text(e.value);
            },
            start: function () {
                $(".rs-first").data("dragging", true);
            },
            stop: function () {
                $(".rs-first").data("dragging", false);
            },
            change: function () {
                deviceController.control({"fan_set_2": $inputFanSet.val()});
            }
        });

这里只是简单的介绍，其实他还有许多的精彩内容没有一一呈现，有兴趣的人可以链接下面的地址：

http://roundsliderui.com/