Range Slider

Provides https://rangeslider.js.org/ integration with a Field Widget, Form API and Webform.

GitHub mirror: https://github.com/drupal-modules/range_slider

Form API example

$form['example'] = [
  '#type' => 'range_slider',
  '#title' => 'Rangeslider element',
  '#min' => 5,
  '#max' => 30,
  '#step' => 2,
  '#default_value' => 12,
  '#description' => 'Example range slider form element.',
  '#data-orientation' => 'horizontal',
  '#output' => 'below',
  '#output__field_prefix' => '$',
  '#output__field_suffix' => 'USD',
];

Field widget example

Webform example

Read more about the rangeslider.js project: