Slider
Slides are passed as default slot content. Supports manual navigation and optional autoplay with configurable interval.
vue
<vs-slider :autoplay="true" :interval="3000">
<div class="w-full h-64 bg-red-500 flex items-center justify-center text-white text-2xl">Slide 1</div>
<div class="w-full h-64 bg-green-500 flex items-center justify-center text-white text-2xl">Slide 2</div>
<div class="w-full h-64 bg-blue-500 flex items-center justify-center text-white text-2xl">Slide 3</div>
</vs-slider>
Slide 1
Slide 2
Slide 3
API
Props
Prop | Type | Default | Description |
---|---|---|---|
interval | number | 3000 | Time in milliseconds between slide changes during autoplay. |
autoplay | boolean | false | Enable or disable automatic slide switching. |
Auto play off
vue
<vs-slider :autoplay="false">
<div class="w-full h-64 bg-red-500 flex items-center justify-center text-white text-2xl">Slide 1</div>
<div class="w-full h-64 bg-green-500 flex items-center justify-center text-white text-2xl">Slide 2</div>
<div class="w-full h-64 bg-blue-500 flex items-center justify-center text-white text-2xl">Slide 3</div>
</vs-slider>
Slide 1
Slide 2
Slide 3