rangeslider
data-role=”rangeslider”は2つの値の間隔を指定できるスライダーが作成できる属性です。
jQuery Mobileはtype属性「range」をもつinput要素を、値を特定の値の間から選択できるスライダーに変換しますが、rangesliderは2つの値が選択できます。
data-role=”rangeslider”ではtype属性「range」をもつinput要素を2つ設置しそれぞれに同じmin属性とmax属性を指定します。それぞれにlabel要素でラベルが指定できますがrangesliderのラベルには最初に指定したlabel要素が採用されます。
<div data-role="rangeslider">
<label for="range-1a">Rangeslider:</label>
<input type="range" name="range-1a" id="range-1a" min="0" max="100" value="40">
<label for="range-1b">Rangeslider:</label>
<input type="range" name="range-1b" id="range-1b" min="0" max="100" value="80">
</div>
jQuery Mobile 1.3.0での追加/変更data-role="rangeslider"はjQuery Mobile 1.3.0で追加された属性です。
参考URL
Rangeslider - jQuery Mobile Demos
登録日 : 2013年03月03日 最終更新日 : 2016年12月19日