Всем привет! Сегодня я расскажу, как сделать круговой ползунок на JQuery , используя плагин JQuery Knob .

Как сделать круговой ползунок на JQuery.

Всем привет! Сегодня я расскажу, как сделать круговой ползунок на JQuery, используя плагин JQuery Knob.

Как всегда, посмотреть, как это работает, вы можете здесь, а скачать тут.

Работает данный плагин на canvas, т.е. никаких картинок или тем более flash-анимации нет.

Вы можете как нажимать на ползунок, так и работать колесиком мыши или клавиатурой.

Теперь поговорим о том, как это установить. Это очень просто. Пример ниже.

<input type="text" value="75" class="dial">

<script>
$(function() {
  $(".dial").knob();
}); </script>

Устанавливать опции вы можете как через атрибуты data, так и с помощью json.

Найти все параметры вы сможете на GitHub в разделе Options.

Понятно, что если вы используете какой-то метод, то его можно задать только через json. К примеру

<script>
  $(".dial").knob({
   'release' : function (v) { /*make something*/ }
  });
</script>

Теперь при изменении значения будет что-то происходить.

А у меня на этом все. Спасибо за внимание и удачи!