Skip to content

Animacion

Animacion v-model: 50

Activar animacion

La animacion agrega una transicion suave cuando el slider cambia de valor al hacer tap o al usar .set():

vue
<Slider
    v-model="value"
    :range="{ min: 0, max: 100 }"
    :animate="true"
    behaviour="tap"
/>

Duracion personalizada

Por defecto la animacion dura 300ms. Podes personalizar la duracion:

vue
<Slider
    v-model="value"
    :range="{ min: 0, max: 100 }"
    :animate="true"
    :animation-duration="500"
    behaviour="tap"
/>

Desactivar animacion

vue
<Slider
    v-model="value"
    :range="{ min: 0, max: 100 }"
    :animate="false"
/>

TIP

Tanto animate como animationDuration son reactivos. Podes cambiarlos en tiempo de ejecucion y el slider se actualiza automaticamente.

Distribuido bajo la licencia MIT.