A slider allows you to select a value from a range of numbers:
To create a slider, use <input type="range">:
Use the following attributes to specify restrictions:
Tip: If you want to show the value on the slider button, add data-show-value="true":
Tip: If you want to the value to pop up on your screen like a tooltip (as you slide), add data-popup-enabled="true":
Tip: If you want to highlight the track up to the slider value, add data-highlight="true":
A flip switch is often used for on/off or true/false buttons:
To create a flip switch, use <input type="checkbox"> and specify a data-role of "flipswitch":
By default, the text on the flip switch is "On" and "Off". Use the data-on-text and data-off-text attributes to change this:
Tip: Use the "checked" attribute to set one of the options to be pre-selected:
Range
slider
How to make a slider with two handles, allowing users to specify a minimum and maximum value
in a range.
Style Flip Switch
How to make the flip switch wider.
Your message has been sent to W3Schools.