jQuery：创建一个圆形滑块

你可能以前看过JavaScript滑块：

http://dev.jquery.com/view/tags/ui/1.5b2/demos/ui.slider.html

我想象的是一个圆形滑块。 它将由圆圈上一点处的可拖动按钮组成 – 该按钮可以沿着环的任何位置拖动。 该值取决于按钮的位置（想想时钟）。

Answer 1

在m处定义中心点c当前鼠标点

在你的鼠标拖动事件处理程序中，你有

var dx = mx-cx; var dy = my-cy; var scale = radius/Math.sqrt(dx*dx+dy*dy); slider.x = dx*scale + cx; slider.y = dy*scale + cy; 

radius是滑块的某个预设值，

Answer 2

怎么样： http ： //www.thewebmasterservice.com/dev-blog/curved-rounded-or-circular-sliders-javascript-jquery-ui

一些解释和演示。

Answer 3

这个插件怎么样http://controlwheel.com/ 。 它易于使用，并有一些例子

Answer 4

我写了一个jQuery插件 ，支持完整/半圆滑块。

演示页面和文档

Answer 5

从这里http://roundsliderui.com/查看jQuery roundSlider插件。 这正是你想要的。

这个roundslider有类似jQuery ui滑块的选项。 它支持默认，最小范围和范围滑块类型。 它不仅支持圆形滑块，还支持各种圆形 ，如四分之一 ， 一半和圆形。

有关更多详细信息，请查看演示和文档页面。

请查看jsFiddle的演示。

相关回答： https ： //stackoverflow.com/a/31367164/1845801和https://stackoverflow.com/a/31369265/1845801

截图：