dw-carousel-3d
Beautiful, flexible and touch supported 3D Carousel for Vue.js
3,749
| Install | |
|---|---|
npm install dw-carousel-3d |
|
| Latest Version: | 1.0.7 |
| Vue: | 2 |
| License: | MIT |
| Last Updated: | Jul 2, 2021 |
| Links: | npm |
Maintainer: darewayxiaofan
dw carousel 3d
Installation
npm install -S dw-carousel-3d
Usage
Usage (Global)
import Vue from 'vue';
import Carousel3d from 'dw-carousel-3d';
Vue.use(Carousel3d);
This will make <carousel-3d> 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 'dw-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:
<carousel-3d>
<slide :index="0">
Slide 1 Content
</slide>
<slide :index="1">
Slide 2 Content
</slide>
</carousel-3d>
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.
Changelog
####Version 1.0.0
- All dependencies updated to the latest
- Added one directional carousel and updated the docs (docs updated)
- area-labels added to the buttons
- Y-axys swipe bug fixed.
- Fix SSR
- onMainSlideClick callback now returns the slide index as function parameter (docs updated)
- Added scoped slides (docs updated)
Related Packages
@nanoandrew4/vue3-carousel-3d
Beautiful, flexible and touch supported 3D Carousel for Vue.js
13,674
4
Version History
| Version | Released | Vue | License |
|---|---|---|---|
| 1.0.7 | ^2.6.11 | MIT | |
| 1.0.6 | ^2.6.11 | MIT | |
| 1.0.5 | ^2.6.11 | MIT | |
| 1.0.4 | ^2.6.11 | MIT | |
| 1.0.3 | ^2.6.11 | MIT | |
| 1.0.2 | ^2.6.11 | MIT | |
| 1.0.1 | ^2.6.11 | MIT | |
| 1.0.0 | ^2.6.11 | MIT |