shadow
Element Slider je interaktívny komponent posuvníka, ktorý umožňuje používateľom praktickým spôsobom vybrať hodnotu z rozsahu hodnôt. Ponúka handle (rukoväť), ktorou možno pohybovať, takže je ideálny pri tých scenároch, ktoré od používateľa vyžadujú číselný vstup alebo úpravu nejakého nastavenia, napríklad hlasitosti.
V predvolenom nastavení výber umožňuje používateľovi vybrať len jednu možnosť. Zahrnutím elementu Icon sa pri možnosti zobrazí aj zvolená ikona.
Pridaním atribútu bubble sa nad sliderom zobrazí bublina s číslom vyjadrujúcim aktuálnu hodnotu posuvníka.
| Description | Defines the maximum value of the slider. |
| Attribute | max |
| Type | number ｜ undefined |
| Default | undefined |
| Description | Defines the minimum value of the slider. |
| Attribute | min |
| Type | number ｜ undefined |
| Default | undefined |
| Description | Defines the interval between each slider value. |
| Attribute | step |
| Type | number ｜ undefined |
| Default | undefined |
| Description | Defines the current value of the slider. |
| Attribute | step |
| Type | number ｜ undefined |
| Default | undefined |
| Name | Description |
|---|
wj:slider-change | Called up when the slider value is changed. |
wj:slider-init | Called after the initial slider load. |
wj:slider-move | Invoked after moving the slider handle. |
No public methods available for this component.
| Name | Description |
|---|
slider | Refers to input inside the element. |
| Name | Description |
|---|
--wj-slider-color | Defines the colour of the slider. |
--wj-slider-thumb-color | Defines the color of the slider handle. |
--wj-slider-thumb-shadow | Defines the box-shadow handles of the slider. |
--wj-slider-thumb-shadow-active | Defines the box-shadow of the slider handle in the active state. |
--wj-slider-track-color | Defines the color of the slider's sliding path. |
--wj-slider-track-height | Defines the height of the slider travel. |
| Name | Description |
|---|
end | The content is placed on the right in the LTR and on the left in the RTL. |
label | The content is placed to the right of the slider path in LTR and to the left in RTL. |
start | The content is placed on the left in the LTR and on the right in the RTL. |