Ranger Demo

View Documentation

Basic

The most basic method is simply applying the Ranger plugin:

$(".target").ranger();

<input type="range" min="10" max="20" />
<input type="range" min="0" max="100" value="35" step="5" />
<input type="range" min="0" max="1" value="0.25" step="0.01" />

Demo

Basic

You can also specify a vertical Ranger:

$(".target").ranger({
	vertical: true
});

// Or (Note: the 'orient' attribute will not validate)

<input type="range" min="0" max="100" value="35" step="5" orient="vertical" />

Demo