Default slider
Horizontal slider with a single handle.
Primary slider
Horizontal slider with a single handle.
Success slider
Horizontal slider with a single handle.
Info Slider
Horizontal slider with a single handle.
Warning slider
Horizontal slider with a single handle.
Danger slider
Horizontal slider with a single handle.
Circular handle ( )
A single handle with no value selected.
Range slider [ , ]
Horizontal slider with two drag handles.
Fixed maximum [ , 100.00]
The user can only select a minimum.
Fixed dragging [ , ]
Keeps the distance between handles fixed.
Furthermore every part of this component can changed with variables stated in _variables.scss. We have also created a
plugin to use this library by writing HTML only.
<div data-slider="primary" data-start="40" data-target="#input-id"></div>
Advanced Examples
Besides the presentation of vertical option, two other examples show the possibility of interaction with toastr.
