I am trying to use jQuery Knob for a thermostat UI. I would like to allow for the ability to control a range (heat - cool).
I've been able to achieve this look by stacking several knobs, however, this essentially disabled the clicking/dragging functionality.
Red cursor: Heat, Blue cursor: Cool, White cursor: current temp.
// Obligatory code for Fiddle link
<input type="text" class="knob1" value="56">
I tried to customize the appearance of jQuery knob, but as per the current behavior of knob we can't add additional handles with it.
Alternatively you can use the jQuery roundSlider plugin, which is very flexible to use so that we can add multiple handles with a single slider.
Check the exact demo for your requirement: jsFiddle
Screenshot of the Output: