jQuery Mobile - Range Slider Widget

You can use rangeslider widget by adding the data-role attribute and setting it to rangeslider.

You can force the slider to snap to a specific increment by adding the step attribute to the input.

To have no highlight on the track up to the handle position of the slider, add the data-highlight attribute and set to false.

You can set the theme for your rangeslider by using data-track-theme and data-theme attribute.

For more compact version of rangeslider you can use data-mini attribute.

You can disable the rangeslider by using disabled attribute.

You can hide the label of the rangeslider by adding the ui-hidden-accessible class to your label.

Adding ui-field-contain class to the div wrappers of form elements will ensure that the form is rendered responsively.

The ui-field-contain class can be added to mini rangeslider in order to render it responsively.