Slider
El control deslizante de mdui se implementa con el campo de entrada HTML5 <input type="range" />.
Modo de uso
El slider se inicializa automáticamente al cargar la página. Para los sliders generados dinámicamente, debes llamar a mdui.mutation() para inicializarlos.
Color
Usar color de acento.
Lectura relacionada
<label class="mdui-slider">
<input type="range" step="0.1" min="0" max="100"/>
</label><label class="mdui-slider mdui-slider-discrete">
<input type="range" step="1" min="0" max="100"/>
</label>Estado deshabilitado
En el elemento input de un slider continuo o discreto, puedes añadir el atributo disabled para deshabilitarlo.
Slider continuo:
<!-- Valor por defecto 0 -->
<label class="mdui-slider">
<input type="range" step="0.1" min="0" max="100" value="0" disabled/>
</label>
<!-- Valor por defecto distinto de 0 -->
<label class="mdui-slider">
<input type="range" step="0.1" min="0" max="100" value="50" disabled/>
</label>Slider discreto:
<!-- Valor por defecto 0 -->
<label class="mdui-slider mdui-slider-discrete">
<input type="range" step="1" min="0" max="100" value="0" disabled/>
</label>
<!-- Valor por defecto distinto de 0 -->
<label class="mdui-slider mdui-slider-discrete">
<input type="range" step="1" min="0" max="100" value="50" disabled/>
</label>Slider generado dinámicamente
Si el componente slider se genera dinámicamente, necesitas llamar a mdui.mutation() para inicializarlo.
Si cambias dinámicamente el valor del slider, debes llamar al método mdui.updateSliders() para reinicializar el componente. Este método acepta un argumento, que puede ser un selector CSS que incluya la clase .mdui-slider, un elemento DOM o un array de elementos DOM, para indicar qué sliders reinicializar. Si no se pasa ningún argumento, se reinicializarán todos los sliders de la página.