Slider
Os sliders do mdui são implementados usando o campo de entrada <input type="range" /> do HTML5.
Como usar
O componente slider é inicializado automaticamente após o carregamento da página. Para sliders gerados dinamicamente, é necessário chamar mdui.mutation() para inicialização.
Cores
Usa a cor de destaque.
Leitura relacionada
Diretrizes de design do Material Design: Componentes - Sliders
<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 desativado
Adicione o atributo disabled ao elemento input de um slider contínuo ou discreto para desativar o slider.
Slider contínuo:
<!-- Valor padrão é 0 -->
<label class="mdui-slider">
<input type="range" step="0.1" min="0" max="100" value="0" disabled/>
</label>
<!-- Valor padrão não é 0 -->
<label class="mdui-slider">
<input type="range" step="0.1" min="0" max="100" value="50" disabled/>
</label>Slider discreto:
<!-- Valor padrão é 0 -->
<label class="mdui-slider mdui-slider-discrete">
<input type="range" step="1" min="0" max="100" value="0" disabled/>
</label>
<!-- Valor padrão não é 0 -->
<label class="mdui-slider mdui-slider-discrete">
<input type="range" step="1" min="0" max="100" value="50" disabled/>
</label>Slider gerado dinamicamente
Se o seu componente slider for gerado dinamicamente, é necessário chamar mdui.mutation() para inicialização.
Se você modificar o valor do slider dinamicamente, precisará chamar o método mdui.updateSliders() para reinicializar o componente slider. Este método aceita um parâmetro, que pode ser um seletor CSS contendo a classe .mdui-slider, um elemento DOM ou um array de elementos DOM, usado para especificar o slider a ser reinicializado. Se nenhum parâmetro for passado, todos os sliders na página serão reinicializados.