type='range'

プロパティ

value

valueプロパティに値を設定することで、スライダーの位置を制御できます。

<input type="range" oninput="this.nextSibling.value = this.value" />
<input type="text" onkeyup="this.previousSibling.value = this.value" />

step

minとmaxによって決定される範囲より小さな値を指定しないと、スライダーを操作できなくなります。

   
min="0.0" max="0.1"
min="0.0" max="0.1" step="0.01"

イベント

スライダーが移動されたことはoninputで捕捉できますが、このイベントはブラウザによっては対応していないことがあるため、より確実にはonchangeと併用します。javascript - onchange event on input type=range is not triggering in firefox while dragging - Stack Overflow

oninputのみ
onchangeのみ
oninput、onchange併用
JavaScriptのドキュメントから検索