@nanoandrew4/vue3-carousel-3d
v1.0.0
Published
Beautiful, flexible and touch supported 3D Carousel for Vue.js
Downloads
599
Maintainers
Readme
Vue Carousel 3d
Full documentation and examples
Table of Contents
Installation
npm install -S @nanoandrew4/vue3-carousel-3d
Usage
Usage (Global)
You may install Vue Carousel 3d globally:
import '@nanoandrew4/vue3-carousel-3d/dist/style.css'
import { createApp } from 'vue'
import { Carousel3dPlugin } from '@nanoandrew4/vue-carousel-3d'
const app = createApp(App)
app.use(Carousel3dPlugin)
This will make <Carousel3d> and <Slide> available to all components within your Vue app.
Usage (Local)
Include the Carousel 3d into your component using import:
import { Carousel3d, Slide } from 'vue-carousel-3d';
export default {
...
components: {
Carousel3d,
Slide
}
...
};
HTML Structure
Once the Carousel3d and Slide components are installed globally or imported, they can be used in templates like below:
<Carousel3d>
<Slide :index="0"> Slide 1 Content </Slide>
<Slide :index="1"> Slide 2 Content </Slide>
</Carousel3d>
Keep in mind that index property on slide component is required property and you will need to pass it for every slide starting from 0
License
This project is licensed under the MIT License - see the LICENSE.md file for details.