Slider

Also try using the arrow keys, buttons, or clicking on the progress bar to move the slider.

initial value=10, min=0, max=100, pageIncrement=100, onChange event triggers input box value change immediately
Horizontal Slider Example
Disable previous slider Enable previous slider

initial value=10, min=0, max=100, onChange event triggers input box value change when you mouse up or tab away
Vertical Slider Example

Fancy HTML labels (no slide animation):

Standalone ruler example:

1
2

horizontal, with buttons, disabled (to show styling):

Completely Programatic VerticalSlider and VerticalRule

min:1000, max:3000, 11 discrete values, no animation