vue-snap-gallery
Image slider using css snap-scroll
Usage
run:
npm i --save @nerdcel/vue-snap-gallery
or
yarn add @nerdcel/vue-snap-gallery
In your Vue main.js:
import Vue from 'vue';
import SnapGallery from '@nerdcel/vue-snap-gallery';
Vue.use(SnapGallery);In your template
<snap-gallery :srcset="[{src: '...'}, {...}]"
gap="3"
:event="customEvent"
ref="gallery"
:autoplay="true"
interval="3000"
delay="5000"
/>Component Properties
| Name | Description |
|---|---|
| srcset | [{src: '...'}, {...}] |
| gap | Defines gap between images (x * 10px) |
| event | Custom click event on image. |
(index, img) => { ...doStuff } |
|
| ref | To call methods from outside, |
| e.g this.$refs.gallery.goTo(2) | |
| autoplay |
true or false
|
| interval | Autoplay interval in ms. E.g. 3000 |
| delay | Delay for paused autoplay in ms. |
Project setup
yarn install
Compiles and hot-reloads for development
yarn serve
Compiles and minifies for production
yarn build
Lints and fixes files
yarn lint
Jest Unit test
yarn test:unit