jQuery Mobile slider form
jQuery Mobile slider controls
Slider allows you to select a value from a range of numbers:
To create a slider, use the <input type = "range">:
Examples
<label for="points">进度:</label>
< input type="range" name="points" id="points" value="50" min="0" max="100">
</form>
Use the following attributes to specify restrictions:
- max - the maximum allowed by regulations
- min - the minimum allowed by regulations
- step - specifies the legal number intervals for
- value - the default value specified
Tip: If you want to display in the button can add the value of the progress of the data-show-value = "true " attribute:
Examples
Tip: If you want to show the progress on the slide button (similar to playing a small window) You can use the data-popup-enabled = "true " attribute:
Examples
Tip: If you want to highlight the value of the highlighted slider, add data-highlight = "true":
Examples
Toggle Switches
Fluctuations switch is normally used for on / off or true / false button:
We can use the <input type = "checkbox"> elements and specify the data-role to create the switch is "flipswitch":
Examples
<label for="switch">切换开关:</label>
<input type="checkbox" data-role="flipswitch" name="switch" id="switch">
</form>
By default, the text switch to "On" and "Off". You can use the data-on-text and data-off-text Properties to modify it:
Examples
Tip: You can use the switch box "checked" attribute to set the default option:
Examples
More examples
Interval slider
Make a slide interval values.
Slider Styles
Set the style to the slider switch.