Круглый JQuery UI слайдер

Я ищу что-то похожее на jqueryui slide .

Но главная проблема в моем случае - это круглый дизайн для слайдера. Я видел Управление ручкой , но у него нет кнопок диапазона и управления.

Стреляйте мне ссылку, если вы знаете такой пример. Благодарю.

0
добавлено отредактировано
Просмотры: 1
источник
de
вы можете использовать 2 ручка управления и получить работу! Один для диапазона мин и один для максимального диапазона, просто вам нужно как-то справиться с тем, что они не пересекают ценности друг друга.
добавлено автор Amar, источник
Также посмотрите, помогает ли это: websitemaintenancelabs. ком/Dev-блог/& hellip;
добавлено автор Amar, источник

2 ответы

Проверьте плагин jQuery roundSlider здесь http://roundsliderui.com/ . Это то, что вы хотите точно.

Этот раунд имеет аналогичные параметры, такие как слайдер jQuery ui. Он поддерживает стандартные, минимальные и диапазонные диапазоны. Не только круглый слайдер также поддерживает различные круглые фигуры , такие как четверть, половина и круговыми кругами.

Подробнее см. демо и документация .

Пожалуйста, проверьте демонстрацию jsFiddle .

Живая демонстрация:

<div class="snippet" data-lang="js" data-hide="true" data-console="false" data-babel="false"> <div class="snippet-code snippet-currently-hidden">

$("#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>
</div> </div>

Скриншоты с различной тематикой:

round slider - different theme and appearance circular slider - different theme and appearance radial slider - different theme and appearance

Подробнее о другой теме см. здесь .

1
добавлено
источник

Посмотрите этот пример на interface.eyecon.ro , он имеет круг и перетаскиваемый дескриптор и, глядя на источник страницы, это не слишком сложно.

0
добавлено
источник
Ссылка на потенциальное решение всегда приветствуется, но, пожалуйста, добавьте контекст вокруг ссылки, чтобы у ваших коллег было некоторое представление о том, что это такое и почему оно есть. Всегда указывайте наиболее значимую часть важной ссылки, если целевой сайт недоступен или постоянно находится в автономном режиме.
добавлено автор Tarec, источник