Elastyczny, wielozakresowy suwak HTML 5 lub javascript

Question

Pracuję obecnie nad elastyczną stroną i chciałbym użyć suwaka zakresu z wieloma uchwytami. Pracowałem z niektórymi rozwiązaniami javascript, które działały dobrze, ale nie były responsywne.

Rozważałem opcję dwóch wejść zakresów html5, które z gracją ulegają degradacji na wejściach tekstowych w starszych przeglądarkach. Chciałbym jednak wiedzieć, czy ktoś natknął się na rozwiązanie javascript dla suwaka zakresu z wieloma uchwytami, który działa w środowiskach responsywnych. Wszelkie pomysły i wskazówki?

Answer 1

użyłem fd-slider polyfill/z modernizerem-ładowarka, to było użyteczne na iPadzie. kolejne urządzenia nie były testowane, ponieważ wersja z małym ekranem nie korzystała z nich.

Answer 2

Spróbuj suwaka zakresu jQuery: http://jqueryui.com/slider/#range.

Jest dobrze obsługiwany przez różne przeglądarki.

Answer 3

Te wyglądają naprawdę śliski ale ja ich nie próbował:

http://ghusse.github.io/jQRangeSlider/demo.html

http://razorfish.github.io/JS-Range-Slider/

Answer 4

Można spojrzeć na noUiSlider.

Obsługuje dotyk na wielu urządzeniach i działa dobrze w responsywnych projektach. Nie ma zależności w jQuery itp.

Ujawnienie: Zrobiłem to.

Answer 5

Multihandle suwak składa się z 2 rodzimych wejść, przez Lea Verou here

Answer 6

Dla tych, którzy nadal kończy się tutaj, rozglądając się za opcje, natknąłem się na ten jeden:

Pozwala możesz przekazać tablicę wartości, a nawet narysować odstępy między nimi za pomocą szeregu opcji.