A lightweight vue swipe component that making the slides fade work in pc.
npm install vue-pc-swipe
ES6/commonjs import style is supported.
// ES6
import {Swipe, SwipeItem} from 'vue-pc-swipe';
// commonjs
var Swipe = require("vue-pc-swipe").Swipe;
var SwipeItem = require("vue-pc-swipe").SwipeItem;
<swipe ref="myPcSwipe" :continuous="true" :auto="5000" :startSlide="3" @change="chageSwipe">
<swipe-item>
<div>slide0</div>
</swipe-item>
<swipe-item>
<div>slide1</div>
</swipe-item>
<swipe-item>
<div>slide2</div>
</swipe-item>
</swipe>
you can use change function add indicators、prev or next button.demo
Option | Description |
---|---|
continuous | Boolean(default: true) create an infinite feel with no endpoints |
auto | Number(default: 5000) speed of prev and next transitions in milliseconds |
startSlide | Number(defalut: 0) index position Swipe should start at |
Option | Description |
---|---|
prev() | slide to prev |
next() | slide to next |
getPos() | returns current slide index position |
getNumSlides() | returns the total amount of slides |
slide(index) | slide to set index position |
change(index) | runs at slide change, index is the current slide index position |
MIT@PLDaily