Licence
MIT
Version
0.0.2
Deps
1
Size
32 kB
Vulns
1
Weekly
0
CarouselView
Installation
npm i carousel-viewUsage
- Global registration
You may install Vue Carousel globally:
// in main.js
import CarouselView from 'carousel-view'
import 'carousel-view/dist/style/carousel-view.css'
Vue.use(CarouselView)- Local component
Include the carousel directly into your component using import:
// in your vue file
import { CarouselView } from 'carousel-view'
import 'carousel-view/dist/style/carousel-view.css'
export default {
components: {
CarouselView
}
...
}HTML Structure
<carousel-view>
...your dom
</carousel-view>Configuration
| Property | Type | Default | Description |
|---|---|---|---|
| direction | enum(horizontal/vertical) | 'horizontal' | direction for carousel |
| loop | Boolean | true | Flag to make the carousel loop around when it reaches the end |
| autoHeight | Boolean | true | Adjust the height of the carousel for the current slide. |
| autoWidth | Boolean | false | Adjust the width of the carousel for the current slide. |
| mousewheelControl | Boolean | true | enable mousewheel control |
| paginationVisible | Boolean | true | visibility of pagination |
| paginationClickable | Boolean | true | carousel control via pagination click |
| speed | Number | 300 | animation speed |
| indicatorColor | String | rgba(153, 153, 153, 0.5) | color of indicator |
| indicatorTintColor | String | #007aff | tint color of indicator |
| ... |