Slider
Lo slider di mdui è implementato utilizzando il campo di input <input type="range" /> di HTML5.
Modalità d'uso
Il componente slider viene inizializzato automaticamente al caricamento della pagina. Per gli slider generati dinamicamente, è necessario chiamare mdui.mutation() per l'inizializzazione.
Colore
Utilizza il colore di accento.
Letture correlate
<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>Stato disabilitato
Aggiungi l'attributo disabled all'elemento input di uno slider continuo o discreto per disabilitare lo slider.
Slider continuo:
<!-- Il valore predefinito è 0 -->
<label class="mdui-slider">
<input type="range" step="0.1" min="0" max="100" value="0" disabled/>
</label>
<!-- Il valore predefinito non è 0 -->
<label class="mdui-slider">
<input type="range" step="0.1" min="0" max="100" value="50" disabled/>
</label>Slider discreto:
<!-- Il valore predefinito è 0 -->
<label class="mdui-slider mdui-slider-discrete">
<input type="range" step="1" min="0" max="100" value="0" disabled/>
</label>
<!-- Il valore predefinito non è 0 -->
<label class="mdui-slider mdui-slider-discrete">
<input type="range" step="1" min="0" max="100" value="50" disabled/>
</label>Slider generato dinamicamente
Se il componente slider è generato dinamicamente, è necessario chiamare mdui.mutation() per l'inizializzazione.
Se si modifica dinamicamente il valore dello slider, è necessario chiamare il metodo mdui.updateSliders() per reinizializzare il componente slider. Questo metodo accetta un parametro, che può essere un selettore CSS contenente la classe .mdui-slider, un elemento DOM o un array di elementi DOM, utilizzato per specificare gli slider da reinizializzare. Se non viene passato alcun parametro, verranno reinizializzati tutti gli slider nella pagina.