圆形 Jquery UI 滑块

Question

我正在寻找类似于jqueryui slide 的东西。

但就我而言，主要问题是滑块的圆形设计。我见过Knob control，但它没有范围和控制按钮。

如果您知道这样的示例，请给我一个链接。谢谢。

Answer 1

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

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

更多详情请查看demos 和documentation 页面。

请查看jsFiddle的演示。

现场演示：

$("#slider").roundSlider({
    sliderType: "range",
    value: "20,80"
});

#slider{
  margin: 10px auto 0;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.roundslider/1.0/roundslider.min.js"></script>
<link href="https://cdn.jsdelivr.net/jquery.roundslider/1.0/roundslider.min.css" rel="stylesheet"/>

<div id="slider"></div>

不同主题的截图：

从here查看更多关于不同主题的详细信息。

Answer 2

在interface.eyecon.ro 上查看这个示例，它有一个圆圈和一个可拖动的手柄，从页面源来看它并不太复杂。