Vertical Example

Basic | Slide | Cube | Coverflow | Fade | Flip | Vertical

Jump to the code

Code

Dynamic URLs

<VPSwiper
  base-url="https://picsum.photos/id"
  :number-of-slides="10"
  :lazy-preload-prev-next="0"
  file-ext="/600/400"
  :start-at="30"
  :navigation="false"
  :pagination="{ clickable: true }"
  direction="vertical"
  height="400px"
/>

Slides

<VPSwiper
  :slides="[
    'https://picsum.photos/id/30/600/400',
    'https://picsum.photos/id/31/600/400',
    'https://picsum.photos/id/32/600/400',
    'https://picsum.photos/id/33/600/400',
    'https://picsum.photos/id/34/600/400',
    'https://picsum.photos/id/35/600/400',
    'https://picsum.photos/id/36/600/400',
    'https://picsum.photos/id/37/600/400',
    'https://picsum.photos/id/38/600/400',
    'https://picsum.photos/id/39/600/400',
    'https://picsum.photos/id/40/600/400',
  ]"
  :navigation="false"
  :pagination="{ clickable: true }"
  direction="vertical"
  height="400px"
/>

WARNING

This example is a test using images from https://picsum.photos/