jQuery：创建一个圆形滑块

Question

5

您可能以前见过JavaScript滑块：

我设想的是一个圆形滑块。它由一个可拖动的按钮组成，位于圆的某个点上，该按钮可以沿着环的任何位置拖动。值取决于按钮所在的位置（类似于时钟）。

- Matt

4个回答

1

- dRock

0

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

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

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

请检查jsFiddle上的演示。

截图：

jquery circular sliders - different circle shapes

- Soundar

0

我编写了一个jQuery插件，支持全/半圆形滑块。

- Prince John Wesley

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jimmy · Accepted Answer

定义一个中心点 c 当前鼠标点为 m

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

var dx = m.x-c.x;
var dy = m.y-c.y;

var scale = radius/Math.sqrt(dx*dx+dy*dy);

slider.x = dx*scale + c.x;
slider.y = dy*scale + c.y;

radius将是滑块的预设值。