javascript - 4ステップでレンジスライダーを作る方法は？

Question

jQueryで4ステップのレンジスライダーを作りたいです。添付画像をご覧くださいここに画像の説明を入力してください

問題は、どこから始めればよいかわからないことです。私はこの参考文献を見つけました、そしてあなたが私を正しい方向に向けることができるかどうか疑問に思います。ヒントや参考資料をいただければ幸いです。

ありがとう！

score 1 · Accepted Answer

このような何かがあなたを助けるかもしれません

これらはバニラJSの実装であり<input type="range" />、スライダーとしてスタイルを設定できます。

幸運を

score 0 · Accepted Answer

jQuery UIを使用しstepて、領域ごとに増分するように設定するだけです。次の例を考えてみましょう。

$( "#slider" ).slider({
    min: 0,
    max: 3,
    step: 1 // so we'll move from 0 - 1 - 2 - 3 (4 locations)
});

このロジックを実行すると、4つの異なる場所に移動できるようになります。この場合、毎回1ずつ増加します。

詳細はこちら： http： //jqueryui.com/slider/#steps

2 に答える 2