Package Exports

vue3-carousel
vue3-carousel/dist/carousel.es.js
vue3-carousel/dist/carousel.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue3-carousel) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Vue 3 Carousel

Modern lightweight Vue 3 carousel component

Documentation

https://ismail9k.github.io/vue3-carousel/

TODO

Responsive breakpoints
Mouse/touch dragging
Infinity scroll (wrapping around)
Auto play
Add classes for active and for visible slides
RTL
Vertical scroll
Sync multiple carousel
Enrich a11y

Getting started

Installation

First step is to install it using yarn or npm:

npm install vue3-carousel

# or use yarn
yarn add vue3-carousel

Basic Using

<template>
  <carousel :items-to-show="1.5">
    <slide v-for="slide in 10" :key="slide">
      {{ slide }}
    </slide>

    <template #addons>
      <navigation />
      <pagination />
    </template>
  </carousel>
</template>

<script>
// If you are using PurgeCSS, make sure to whitelist the carousel CSS classes
import 'vue3-carousel/dist/carousel.css';
import { Carousel, Slide, Pagination, Navigation } from 'vue3-carousel';

export default {
  name: 'App',
  components: {
    Carousel,
    Slide,
    Pagination,
    Navigation,
  },
};
</script>