Web ResponsiveComponents
Sliders

Sliders

Usa los sliders cuando necesites que un usuario seleccione un valor dentro de un rango. El slider consiste en una barra horizontal y un controller que se desplaza sobre ella. Como más a la izquierda esté el controller, más bajo será el valor. Como más a la derecha, más alto. También puedes usar sliders cuando necesites que el usuario seleccione un rango de valores.

Sliders continuos

Usa el slider continuo cuando necesites que el usuario defina un parámetro subjetivo que no requiera de un valor específico. Por ejemplo para establecer valores entre “mucho y poco”, “alto y bajo”, “fuerte y flojo”, etc.

Los sliders continuos tienen 3 estados: Normal, Hover y Disabled.

Sliders segmentados

El slider segmentado lo puedes usar cuando necesites que el usuario elija un valor objetivo que requiera de un valor específico. Este tipo de sliders están dividios en segmentos que muestran todos los valores que se pueden seleccionar.

Los sliders continuos tienen 3 estados: Normal, Hover y Disabled.

Sliders por rango

Usar este tipo de sliders cuando necesites que el usuario elija un rango de valores. En este caso el componente tiene dos controllers, uno que se usa para definir el valor mínimo, y otro para definir el valor máximo.

Los sliders por rango tienen 3 estados: Normal, Hover y Disabled.

Estructura

Adapta el ancho del slider al de la estructura de columnas del grid. También puedes combinar el uso de cualquier tipo de slider con otros elementos, como iconos, títulos o hints.

Ajusta los sliders al ancho de las columnas. Usa iconos, títulos y hints según el caso.